上一次总结了JQuery的一些基础选择器(http://redstarofsleep.iteye.com/blog/930579
).
这次继续接下去:
3. 筛选,过滤选择器
(1) :first 这个选择器用来选择符合要求的第一个元素
// 选取第一个DIV
$('div:first')
<div>被选中</div>
<div>没被选中</div>
<div>没被选中</div>
(2) :last 这个跟上面那个相对,选取的是符合要求的最后一个元素
// 选取最后一个DIV
$('div:last');
<div>没被选中</div>
<div>没被选中</div>
<div>被选中</div>
(3) :not(select) 这个选择器是用来选择不符合要求的元素的
// 选择Class不是"test"的元素
$('div:not(.test)');
<div class="test">没被选中</div>
<div class="test">没被选中</div>
<div class="test">没被选中</div>
<div>被选中</div>
<div>被选中</div>
(4) :even 这个选择器用来选择索引是偶数的元素,从0开始编号
// 选取偶数的DIV
$('div:even');
<div>被选中</div>
<div>没被选中</div>
<div>被选中</div>
<div>没被选中</div>
<div>被选中</div>
(5) :odd 与上面的对应,选取索引是奇数的元素(这个就不举例子了)
(6) :eq(index) 这个选择器选择第index个元素
// 选择第3个DIV
$('div:eq(3)');
<div>没被选中</div>
<div>没被选中</div>
<div>没被选中</div>
<div>被选中</div>
<div>没被选中</div>
(7) :gt(index) 选取索引比index大的元素
$('div:gt(2)');
<div>没被选中</div>
<div>没被选中</div>
<div>没被选中</div>
<div>被选中</div>
<div>被选中</div>
(8) :lt(index) 与上面的相反,选取索引比index小的元素
$('div:lt(2)');
<div>被选中</div>
<div>被选中</div>
<div>被选中</div>
<div>没被选中</div>
<div>没被选中</div>
分享到:
相关推荐
本文将对jQuery选择器与过滤器进行一次全面而深入的总结,旨在帮助读者更高效地理解和运用这些工具。 #### 基本选择器 1. **#id**: 选取具有特定ID的元素。 2. **element**: 选取指定类型的HTML元素。 3. **.class...
选择器按功能分为基础选择器、层次选择器、属性选择器、表单选择器、可见性选择器、位置选择器、子元素选择器、内容选择器、属性选择器、表单对象属性选择器以及过滤选择器。每类选择器都有其独特的应用场景,熟悉并...
在JavaScript的世界里,jQuery是一个非常流行和...记住,熟练掌握jQuery选择器将极大地提升你的前端开发效率,让你编写出更加简洁高效的代码。在学习过程中,不断实践和应用这些知识点,你将会成为一个jQuery的大师。
jQuery选择器是jQuery库的核心特性之一,它极大地简化了JavaScript中的DOM元素选择和操作。jQuery完全继承了CSS的风格,并在此基础上提供了更强大和灵活的选择方式。以下是对jQuery选择器的详细说明: **1. 基本...
这篇文章将对jQuery选择器进行全面总结,帮助开发者更好地理解和运用这些工具。 首先,我们要了解基本选择器,这是jQuery选择器的基础。包括: 1. **ID选择器**: 使用`#`符号后跟元素的ID,如`jQuery("#ID")`,它...
### jQuery选择器大全详解 #### 引言 在前端开发领域,jQuery因其强大的功能和简洁的语法而备受青睐。选择器作为jQuery的核心组件之一,扮演着桥梁的角色,连接DOM操作与CSS选择。本文旨在深入解析jQuery提供的48...
jQuery选择器是jQuery库的核心功能之一,用于高效地定位并操作网页中的DOM元素。通过使用jQuery选择器,开发者可以轻松地选取需要的HTML元素,并执行一系列的DOM操作,如添加样式、修改内容或绑定事件等。 1. **...
### jQuery选择器速查表知识点 jQuery选择器是jQuery库中用于选取HTML元素的强大工具。通过不同的选择器,我们可以轻松地选中页面中的元素并进行操作。本速查表将介绍几种不同类型的选择器,以供查询和参考。 ####...
2. **内容过滤选择器** - 用于选择包含特定文本或元素的元素。 - 实例: `$("p:contains('Hello')")` 获取所有包含`Hello`文本的`<p>`元素 - **注意:** 在`:contains(text)`中,如果是查找字母,则会区分大小写。 ...
jquery基本过滤选择器举例、代码、html、可直接运行、学习jquery入门篇
总结来说,jQuery的可见性过滤选择器`:visible`和`:hidden`是开发者在处理页面动态显示和隐藏元素时的有力工具。它们不仅可以单独使用,还能与其他jQuery方法配合,实现更多样的交互效果。了解并熟练掌握这些选择器...
这个名为"jQuery选择器.rar"的压缩包文件显然包含了关于jQuery选择器的相关学习资源,可能包括示例代码、教程文档等。这些内容可能与《锋利的jQuery第二版》这本书中的章节相匹配,该书是jQuery学习的经典参考资料之...
通过`org.htmlparser.Parser`库,我们可以实现对HTML文档的解析,并利用自定义的过滤器来模拟jQuery选择器的功能。然而,由于JavaScript和Java在处理DOM上的本质差异,完全复制jQuery的功能可能会较为复杂,因此在...
3. **简单过滤选择器** - `:first`或`First()`:选取第一个元素,如`$("div:first")`选取第一个`<div>`。 - `:last`或`Last()`:选取最后一个元素,如`$("div:last")`选取最后一个`<div>`。 - `:not(选择器)`:...
基本过滤选择器帮助我们从一组元素中筛选出特定的元素: 1. `$("tr:first")` - 选取所有 `<tr>` 元素的第一个。 2. `$("tr:last")` - 选取所有 `<tr>` 元素的最后一个。 3. `$("input:not(:checked) + span")` - ...
### jQuery选择器详解 在网页开发中,jQuery作为一款轻量级、功能强大的JavaScript库,极大地简化了HTML文档遍历、事件处理、动画以及Ajax交互等操作。其中,选择器是jQuery的核心特性之一,它提供了丰富的语法来...
jQuery选择器是jQuery库的核心功能之一,它使得开发者能够高效地选取HTML文档中的特定元素,进行操作或应用样式。在jQuery中,选择器分为多种类型,包括基本选择器、层次选择器、过滤器选择器以及内容和属性过滤器。...
本文实例讲述了jQuery选择器之基本过滤选择器用法。分享给大家供大家参考,具体如下: 前面一篇介绍了层次选择器,今天我们学习一下jQuery的另一种选择器:基本过滤选择器。过滤选择器可以过滤掉自己不想要的东西,...
除此之外,内容过滤选择器可以选择包含特定子元素或文本的元素,属性过滤选择器可以根据属性来选取元素,表单选择器用来选取不同类型的`<input>`元素,可见性过滤选择器用于选择可见或隐藏的元素等。 在使用选择器...