jQuery
大约 1 分钟
一、jQuery安装
方法一:
引入:
<head>
<script src="jquery-1.10.2.min.js"></script>
</head>
方法二:
从CDN中载入
Staticfile CDN:
<head>
<script src="https://cdn.staticfile.org/jquery/1.10.2/jquery.min.js">
</script>
</head>
百度 CDN:
<head>
<script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js">
</script>
</head>
又拍云 CDN:
<head>
<script src="https://upcdn.b0.upaiyun.com/libs/jquery/jquery-2.0.2.min.js">
</script>
</head>
新浪 CDN:
<head>
<script src="https://lib.sinaapp.com/js/jquery/2.0.2/jquery-2.0.2.min.js">
</script>
</head>
Google CDN:不大推荐使用Google CDN来获取版本,因为Google产品在中国很不稳定。
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js">
</script>
</head>
Microsoft CDN:
<head>
<script src="https://ajax.aspnetcdn.com/ajax/jquery/jquery-1.9.0.min.js"></script>
</head>
二、语法:
基础公式:
$(selector).action()
举例:
$(this).hide() 隐藏当前元素
$("p").hide() 隐藏所有p元素
$("p.test).hide() 隐藏所有class值为test的p标签元素
$("#test").hide() 隐藏id值为test的元素
文档就绪事件
防止文档在完全加载就绪之前就运行jquery代码
$(document).ready(function(){
// jquery代码
})
================
$(function()
{
// jquery代码
})
三、选择器
语法 | 描述 |
---|---|
$("*") | 选择所有元素 |
$(this) | 选择当前html元素 |
$("p.intro") | 选取class值为intro的p元素 |
$("p:first") | 选取第一个p元素 |
$("ul li:first") | 选取第一个ul元素的第一个li元素 |
$("ul li:first-child") | 选取每一个ul元素的第一个li元素 |
$("[href]") | 选取带有href属性的元素 |
$("a[target='_blank']") | 选取所有target属性值等于_blank的a标签 |
$("a[target!='_blank']") | 选取所有target属性值不等于)_blank的a标签 |
$(":button") | 选取所有type为button的input元素和button元素 |
$("tr:even") | 选取偶数位置的tr元素 |
$("tr:odd") | 选取奇数位置的tr元素 |