专业网站建设品牌,十四年专业建站经验,服务6000+客户--广州京杭网络
免费热线:400-963-0016      微信咨询  |  联系我们

jQuery 遍历 - eq() 方法_js/jQuery

当前位置:网站建设 > 技术支持
资料来源:网络整理       时间:2023/3/4 1:05:22       共计:3633 浏览

通过为 index 为 2 的 div 添加适当的类,将其变为蓝色:

$("body").find("div").eq(2).addClass("blue");

定义和用法

eq() 方法将匹配元素集缩减值指定 index 上的一个。

语法

.eq(index)
参数描述
index

整数,指示元素的位置(最小为 0)。

如果是负数,则从集合中的最后一个元素往回计数。

详细说明

如果给定表示 DOM 元素集合的 jQuery 对象,.eq() 方法会用集合中的一个元素构造一个新的 jQuery 对象。所使用的 index 参数标示集合中元素的位置。

请看下面这个简单的列表:

<ul>
  <li>list item 1</li>
  <li>list item 2</li>
  <li>list item 3</li>
  <li>list item 4</li>
  <li>list item 5</li>
</ul>

例子 1

我们可以把该方法应用到这个列表项目集:

$('li').eq(2).css('background-color', 'red');

亲自试一试

这个调用的结果是为项目 3 设置了红色背景。请注意,index 是基于零的,并且是在 jQuery 对象中引用元素的位置,而不是在 DOM 树中。

例子 2

如果提供负数,则指示从集合结尾开始的位置,而不是从开头开始。例如:

$('li').eq(-2).css('background-color', 'red');

亲自试一试

这次,项目 4 的背景变为红色,这是因为它是集合结尾开始的第二个。

例子 3

如果无法根据指定的 index 参数找到元素,则该方法构造带有空集的 jQuery 对象,length 属性为 0。

$('li').eq(5).css('background-color', 'red');

亲自试一试

这里,没有列表项会变为红色,这是因为 .eq(5) 指示的第六个列表项。


版权说明:
本网站凡注明“广州京杭 原创”的皆为本站原创文章,如需转载请注明出处!
本网转载皆注明出处,遵循行业规范,如发现作品内容版权或其它问题的,请与我们联系处理!
欢迎扫描右侧微信二维码与我们联系。
·上一条:CSS 菜单(有子菜单/子分类)显示图标,没有不显示_CSS学习 | ·下一条:给网页图标字体 Font Awesome 添加动画效果_CSS学习

Copyright © 广州京杭网络科技有限公司 2005-2025 版权所有    粤ICP备16019765号 

广州京杭网络科技有限公司 版权所有