jQuery常用选择器

2013-09-10 11:00:00
admin
原创
4221
jQuery选择器类似于CSS选择器,可以对比学习了解:
名称                    HTML                    CSS          jQuery
标签选择器          <div>….</div>          div{}          $(“div”)ID选择器       <div id=”abc”></div>    #abc{}        $(“#abc”)

类选择器     <div></div>   .abc{}         $(“.abc”)

群组选择器   <div></div><p></p>       div,p{}     $(“div,p”)

后代选择器   <div><p>
<a>…</a>              div p a{}     ${“div p a”}
</p><div>

通配选择器                                           *{}          ${“*”}

注:区分     div.abc     div, .abc     div .abc
div.abc是指class为abc的div元素,即<div class=””abc”>..</div>,其实就是双层条件,增强定位准确性,因为文档里可能有多个class=“abc”的元素。
div, .abc是用于拥有相同样式的不同元素,以避免代码重复。
div .abc 是指div里面的class=”abc”的元素,是包含关系但不一定是父子关系。

层次选择器:

可以这么理解,子元素是特殊的后代元素,相邻元素是特殊的兄弟元素。
注:区分     .next()     .nextAll()     .siblings()
.next()是指紧接其后的兄弟元素,注意必须是紧接其后的相邻那个,中间若有插足则无效。
.nextAll()是指其后面的所有兄弟元素
.siblings()是指其前后所有的兄弟元素
而且这几个方法使用时不建议参数为空,如果为空,相当于是*,即:
.next() ==.net(“*”)     //不但影响性能,还容易出现混乱。

建议使用上面的方法,而避免使用+或~

版权声明

版权声明:本站原创文章,转载请注明作者和出处。

本站点采用 知识共享署名-非商业性使用-禁止演绎 4.0 国际许可协议