1.jQuery-选择器
1)基本选择器
#id
根据给定的ID匹配一个元素
$("#myDiv");
element
根据给定的元素名匹配所有元素
$("div");
.class
根据给定的类匹配元素
$(".myClass");
*
匹配所有元素
$("*")
selector1,selector2,selectorN
将每一个选择器匹配到的元素合并后一起返回。
$("div,span,p.myClass")
2）层级选择器
ancestor descendant
在给定的祖先元素下匹配所有的后代元素
$("form input")
parent > child
匹配父级元素下的子级元素
$("form > input")
prev + next
匹配所有紧接在 prev 元素后的 next 元素（相当于css中的相邻选择器）
$("label + input")
prev ~ siblings
匹配 prev 元素的所有同辈 siblings 元素（相当于css中的兄弟选择器）
$("form ~ input")
3)基本过滤选择器
:first
获取第一个元素
$('li:first'); //获取第一个li元素
:last
获取最后个元素
$('li:last') //获取最后一个li元素
:not(selector)
匹配没有指定的selector元素/选择器的元素。
$("div:not(.one)") //匹配class名不为one的div
:even
匹配所有索引值为偶数的元素，从 0 开始计数(但在表格中实际匹配的是第1,3,5...行)
$("tr:even") //匹配索引为偶数的所有行,实际是第1,3,5....(奇数)行
:odd
匹配所有索引值为奇数的元素，从 0 开始计数(实际匹配的是第偶数行)
$("tr:odd")
:eq()
匹配一个给定索引值的元素
$("div:eq(3)") //匹配索引为3的div
:gt()
匹配所有大于给定索引值的元素
$("tr:gt(0)") //匹配除第一行之外，以后的所有行
:lt(3)
匹配所有小于给定索引值的元素
$("tr:lt(2)") //查找索引小于2，即第1.2行
:header
匹配如 h1, h2, h3之类的标题元素
$(":header").css("background", "#EEE"); //给所有的标题加上背景色
:animated
匹配所有正在执行动画效果的元素
$("div:not(:animated)").animate({ left: "+=20" }, 1000); // 对不在执行动画效果的元素执行一个动画特效
4）可见性过滤选择器
:visible
匹配所有的可见元素
$("tr:visible")
:hidden
匹配所有不可见元素，或者type为hidden的元素
$("tr:hidden")
5)内容过滤选择器
:contains(text)
匹配包含给定文本的元素
$("div:contains('John')")
:empty
匹配所有不包含子元素或者文本的空元素
$("td:empty") //返回所有内容为空的td
:has(selector)
匹配含有selector这个选择器的元素
$("div:has(p)").addClass("test"); //给所有包含 p 元素的 div 元素添加一个 text 类
:parent
匹配含有子元素或者文本的元素
$("td:parent") //查找所有含有子元素或者文本的 td 元素
6）子元素过滤器
:nth-child( )
匹配其父元素下的第N个子元素
$("ul li:nth-child(2)") //在每个 ul 查找第 2 个li
:first-child
获取匹配的第一个元素
$('li').first() //获取第一个li
:last-child
匹配最后一个子元素
$("ul li:last-child") // 在每个 ul 中查找最后一个 li
:only-child
如果某个元素是父元素中唯一的子元素，那将会被匹配(如果父元素中含有其他元素，那将不会被匹配)
$("ul li:only-child") //在 ul 中查找是唯一子元素的 li
7)属性选择器
[attribute]
匹配包含给定属性的元素。注意，在jQuery 1.3中，前导的@符号已经被废除！如果想要兼容最新版本，只需要简单去掉@符号即可
$("div[id]") //查找所有含有 id 属性的 div 元素
[attribute=value]
匹配给定的属性是某个特定值的元素
$("input[name='newsletter']").attr("checked", true); //查找所有 name 属性是 newsletter 的 input 元素
匹配所有不含有指定的属性，或者属性不等于特定值的元素。
$("input[name!='newsletter']").attr("checked", true); //查找所有 name 属性不是 newsletter 的 input 元素
匹配给定的属性是以某些值开始的元素
$("input[name^='news']") //查找所有 name 以 'news' 开始的 input 元素
匹配给定的属性是以某些值结尾的元素
$("input[name$='letter']") //查找所有 name 以 'letter' 结尾的 input 元素
匹配给定的属性是以包含某些值的元素
$("input[name*='man']") //查找所有 name 包含 'man' 的 input 元素
//比如 <input name="man-news" />, <input name="milkman" />, <input name="letterman2" />都可以匹配到
[selector1][selector2][selectorN]
复合属性选择器，需要同时满足多个条件时使用
$("input[id][name$='man']") //找到所有含有 id 属性，并且它的 name 属性是以 man 结尾的