CSS选择器优先级 jquery选择器优先级

css选择器主要分为三类:标签名选择器、类选择器、ID选择器。当然后续还扩展了一些后代选择器和群组选择器。

 一、 下面对着5中选择器进行举例：

        1. 标签名选择器     div { color：Red;}         即页面中的各个标签名的css样式

        2.类选择器          .divClass {color:Red;}       即定义的每个标签的class 中的css样式

        3.ID选择器         #myDiv  {color:Red;}        即页面中的标签的id

        4.后代选择器（类选择器的后代选择器）  .divClass  span { color:Red;}   即多个选择器以逗号的格式分隔 命名找到准确的标签

        5.群组选择器   div,span,img {color:Red}    即具有相同样式的标签分组显示

二、 选择器的优先级

        1.最高优先级是 (直接在标签中的设置样式，假设级别为1000)<div style="color:Red;"></div>

        2.次优先级是（ID选择器 ,假设级别为100）   #myDiv{color:Red;}

        3.其次优先级是（类选择器，假设级别为10） .divClass{color:Red;}

        4.最后优先级是 （标签选择器，假设级别是 1）  div{color:Red;}

        5.那么后代选择器的优先级就可以计算了啊

        比如 .divClass  span { color:Red;}   优先级别就是：10+1=11

        总结：对于在什么情况下使用什么样的选择器，原则有三点:一选择可以准确的找到要控制的标签；二使用最合理的优先级的选择器；三还要是html和css看起来简洁美观可读性强。

通常: 1.最常用的选择器是类选择器

       2.li  td dd 等经常大量连续出现并且样式相同或相似的情况下，一般选用类选择器和标签选择器结合的后代选择器 例：.XX li/td/dd {}

         3.极少的情况下会用ID选择器。

三、 jquery选择器优先级

 jquery 是没有优先级的，jquery是按照你的条件遍历一次DOM tree，所以写条件的时候最好尽量缩小范围和用ID，避免要遍历全部DOM，这样效率是最快的
比如$('#idA')，$('div .classA')，$('.classA')，效率最好的是$('#idA')，而$('div .classA')又比$('.classA')的效率高，最后一个效率是最低的，因为jquery会遍历整个TREE。