jquery选择器

        周五完成了对jquery选择器的学习，jquery用起来很方便，选择操作对象，节点是他的起步，现在对jquery选择器进行总结:

     基本的选择器：

       $('#id').css('color','red');//根据id属性为id，设置css样式颜色设置成红色

       $('h2').css('background-color','pink');

       $('input').css('width','500px');

       $('.apple').css('background-color','lightgreen');//class属性值查找

       $('*').css('background-color','gray');//通配符

      $('h2,#usertel,#userqq').css('color','lightblue');//联合选择器

    层次选择器：

     $(a d');// 选取a元素里所有的d后代元素

    $('div > span')//在div内部获得子元素span节点

    $('div+span')//在div后边获得紧紧挨着的第一个兄弟关系的span节点，获得的是span节点

    $('prev~siblings')// 选取prev元素之后的所有siblings兄弟元素;

    $('li').css('color','red');

   $('li:even').css('background-color','lightgreen');

   :not(selector选择器) 去除某个节点

   $('li:not(#yun)').css('color','blue');

   $(':header').css('background-color','yello');//:header是一个选择器 可以单独使用，选择所有的H标签

 

过滤选择器：

1、 :contains(text)

       包含内容选择器，获得的节点内部必须包含指定的内容

              $('div:contains(guangzhou)')

  <div>I like <span>guangzhou</span></div>//<span>标签不构成影响

              <div>xiaominglike shanghai</div>

2、:empty

       获得空元素（内部没有任何元素/文本（空））节点对象

              $('div:empty')

              <div>Ilike <span>beijing</span></div>

              <div>   </div>

              <div>hgello</div>

              <div><img/></div>

              <div></div>//选中的是这个

3、:has(选择器)

     节点内部必须包含指定选择器对应的元素

     $('div:has(#apple)');

     <div><p></p></div>

    <div><spanid='apple'>apple</span></div>//选中的是这个

4.其他一些选择器：

    $('li:first');//:first第一个     :last 最后一个

    $('li:eq(3)').css('color','red')//eq(下标索引号码)  获得节点的下标索引值与给定索引值相等

   gt(索引号) great than 节点索引值，大于某个范围

   lt(索引值) less than 节点索引值，小于某个范围

   $('li:gt(5)').css('background-color','pink');

  $('li:lt(5)').css('background-color','orange');

   :even匹配到下标索引值为偶数的节点

   :odd匹配到下标索引值为奇数的节点

   $('li:odd').css('background-color','lightblue');

   [attr] 选取拥有此属性的元素

   [attr = value]选取属性值为value的元素

   [attr^=value]选取属性值以value开头的元素

   [attr$=value] 选取属性值以value结束的元素

   [attr*=value] 选取属性值含有value的元素:nth-child(index) 选取父元素下第index个子元素或者奇偶元素