jQuery（2）——选择器

选择器

利用jQuery选择器，可以非常便捷和快速地找出特定的DOM元素，然后为它们添加相应的行为。jQuery的行为规则都必须在获取到元素后才能生效。

【jQuery选择器的优势】

（1）简洁的写法；

（2）支持CSS1到CSS3选择器；

（3）完善的处理机制；

【jQuery选择器】

jQuery选择器分为基本选择器、层次选择器、过滤选择器和表单选择器。

基本选择器：是jQuery最简单的选择器，通过id、class和标签名等来查找DOM元素。在网页中，id名称只能使用一次，class允许重复使用。详细介绍在《锋利的jQuery》p32。

层次选择器：通过DOM元素之间的层次关系来获取特定元素，例如后代元素、子元素、相邻元素和同辈元素等。

过滤选择器：通过特定的过滤规则来筛选出所需的DOM元素，选择器都已冒号(:)开头。按照不同的过滤规则，过滤选择器可以分为基本过滤、内容过滤、可见性过滤、属性过滤、子元素过滤和表单对象属性过滤选择器。

表单选择器：能极其方便地获取到表单的某个或某类型的元素。

【利用jQuery改写事例】

给网页中所有的<p>元素添加onclick事件。

$("p").click(function(){//获取页面中所有的p元素添加单击事件
        //do something
})

使一个特定的表格隔行变色

$("#tb tbody tr:even").css("backgroundColor","#888");
/*获取id为tb的元素，然后寻找它下面的tbody标签，再寻找tbody下索引值是偶数的tr元素，改变它的背景颜色。css("property","value"):用来设置jQuery对象的样式*/

对多选框进行操作，输出选中的多选框的个数。

$("#btn").click(function(){
    //先使用属性选择器，然后用表单对象属性过滤，最后获取jQuery对象的长度
    var items=$("input[name='check']:checked");
    alert("选中的个数为："+item.length);
});    

【选择器中的一些注意事项】

含有特殊符号的注意事项

（1）选择器含有“.”、“#”、“(”或“]”等特殊字符。

不能含有，解决此类错误的方法是使用转义符转义。

（2）属性选择器的@符号问题。

不需要在属性前添加@符号，去掉@符号即可。

【其他选择器】

jQuery提供的选择器的扩展

（1）MoreSelectors for jQuery：用于增加更多的选择器。

（2）Basic XPath：可以让让用户使用基本的XPath。