jquery的一些属性选择器

时间:2022-11-08 21:54:34
  1. td:contains(Henry)选择td里面所有class为Henry的元素
  2. .siblings()选择相同dom层次的所有其他元素,例如
    <ul>
    <li>第一个</li>
    <li>第二个</li>
    <li>第三个</li>
    <li>第四个</li>
    <li>第五个</li>
    </ul> $("ul li:eq(3)").css("color","red").siblings().css("color","blue") //除了第四个是字体是红色的其他字体颜色都是蓝色的

      

  3. .next() 和 .nextAll() 选择下一个元素,.prev()和 .prevAll()选择上一个元素

  4. .addBack()包括元素本身的下面元素,例如
    <ul>
    <li>第一个</li>
    <li>第二个</li>
    <li class="item">第三个</li>
    <li>第四个</li>
    <li>第五个</li>
    <li>第六个</li>
    </ul> $("ul li").next().addBack().css("color","red");//这样就是第三个和第四个变红,如果不加就是第四个变红  
  5. .end()恢复到元素的第一个方法里去,例如
    <ul>
    <li>第一个</li>
    <li class="item">第二个</li>
    <li>第三个</li>
    <li>第四个</li>
    <li>第五个</li>
    </ul>
    <ul>
    <li>第一个</li>
    <li class="item">第二个</li>
    <li>第三个</li>
    <li>第四个</li>
    <li>第五个</li>
    </ul> $("li:contains(item)") //选择所有的item
    .patent() //取得他们的父元素
    .find("li:eq(3)") //找到第四个li
    .css("color","red") //设置颜色为红色
    .end() //恢复到包含item的父元素  
  6. .get(0)访问jquery对象引用的第一个dom元素,例如
    <ul>
    <li>第一行…………</li>
    <li class="my-element">第二行…………</li>
    <li>第三行…………</li>
    <li>第四行…………</li>
    <li>第五行…………</li>
    </ul>
    <div class="my-element">123</div> var myTag = $(".my-element").get(0).tagName; //简写形式var myTag = $(".my-element")[0].tagName;
    alert(myTag); //弹出的是li