我是靠谱客的博主 拉长芝麻,最近开发中收集的这篇文章主要介绍jQuery基本筛选器,觉得挺不错的,现在分享给大家,希望可以做个参考。

概述

jQuery基本筛选器

jQuery基本筛选器,是js中没有的一个功能。可以批量选 择或在一批元素中特定选择一个元素,一般与选择器配合使用,非常方便。

:first

选择符合条件的元素中的第一个元素。
html代码

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

jquery代码

   //选中第一个div
    $("div:first").text("第一个div")

:last

选中符合条件的最后一个元素
html代码

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

jquery代码

   //选中最后一个div
    $("div:last").text("最后一个div")

:even

选中符合条件的元素中索引为偶数的元素

   <div></div>
   <div></div>
   <div></div>
   <div></div>
   <div></div>
   //选中索引为偶数的元素
    $("div:even").text("索引为偶数的元素")

:odd

选中符合条件的元素中索引为奇数的元素

   <div></div>
   <div></div>
   <div></div>
   <div></div>
   <div></div>
   //选中索引为奇数的元素
    $("div:odd").text("索引为奇数的元素")

:not()

驱除与给定条件匹配的元素,条件在()中写。

<input type="checkbox" name="first">
<input type="checkbox" name="second" checked="checked">
//选中的元素为第一个
$("input:not(:checked)").css("height" , "50px")

:gt(index)

匹配大于给定索引的元素

   <div></div>
   <div></div>
   <div></div>
   <div></div>
   <div></div>
   //匹配索引大于一的元素
   $("div:gt(1)").text("索引大于一的元素")

:lt(index)

匹配小于给定索引的元素

   <div></div>
   <div></div>
   <div></div>
   <div></div>
   <div></div>
   //匹配索引小于一的元素
   $("div:lt(1)").text("索引小于一的元素")

:eq(index)

匹配指定索引的元素

   <div></div>
   <div></div>
   <div></div>
   <div></div>
   <div></div>
   $("div:eq(2)").text("索引小于一的元素");

:header

匹配h系列的元素

   <h2 class="demo"></h2>
   <div class="demo"></div>
   $("div:header").text("h系列的标签的元素");

:focus()

匹配当前具有焦点的元素

   <input type="text">
   <input type="text">
    //选中当前具有焦点的元素
    $("inout:focus").css("border" , "1px solid red")

:animated

匹配当前的动画元素


好了,这就是所有的筛选器了。

最后

以上就是拉长芝麻为你收集整理的jQuery基本筛选器的全部内容,希望文章能够帮你解决jQuery基本筛选器所遇到的程序开发问题。

如果觉得靠谱客网站的内容还不错,欢迎将靠谱客网站推荐给程序员好友。

本图文内容来源于网友提供,作为学习参考使用,或来自网络收集整理,版权属于原作者所有。
点赞(48)

评论列表共有 0 条评论

立即
投稿
返回
顶部