jQuery 遍历 - eq() 方法

实例

通过为 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) 指示的第六个列表项。

jquery的eq()的更多相关文章

  1. jQuery中eq()方法用法实例

    本文实例讲述了jQuery中eq()方法用法.分享给大家供大家参考.具体分析如下: 此方法能够获取匹配元素集上的相应位置索引的元素. 匹配元素集上元素的位置索引是从0开始的. 语法结构: 复制代码 代 ...

  2. jQuery 遍历 - eq() 方法 查找当前元素

    jQuery 遍历 - eq() 方法 if(data[i].status !='已送达'){ $('.w-beget').eq(i).attr('disabled','disabled'); }

  3. jQuery的eq方法

    定义和用法eq() 方法将匹配元素集缩减值指定 index 上的一个. 语法.eq(index) 其中的index :整数,指示元素的位置(最小为 0).如果是负数,则从集合中的最后一个元素往回计数. ...

  4. JQuery中eq()和get()的区别

    众所周知,eq()方法返回的是一个JQuery对象,也就是[object Object]; get()方法返回的是DOM对象组成的数组,也就是[object HTMLLIElement]; 我们用一个 ...

  5. jQuery 遍历 - eq() 和siblings() 方法

    eq() 方法将匹配元素集缩减值指定 index 上的一个. 通过为 index 为 2 的 div 加入适当的类.将其变为蓝色: <!DOCTYPE html> <html> ...

  6. jQuery 遍历 - eq() 方法

    <!DOCTYPE html> <html> <head> <style> div { width:60px; height:60px; margin: ...

  7. jquery中eq和get的区别与使用方法

    $("p").eq(0).css("color") //因为eq(num)返回的是个jq对象,所以可以用jq的方法css使用get来获得第一个p标签的color ...

  8. jquery 中 eq()遍历方法 和:eq()选择器的区别

    <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8" ...

  9. jQuery选择器 :eq() 不能识别变量参数的问题解决方案

    问题: js语法中,引号内变量会直接解释为字符串,因此使用:eq()时参数将被识别为字符串而不是变量指代的内容 如下错误写法: $(".circle span:eq(count-1)&quo ...

随机推荐

  1. Python的扩展接口[0] -> VISA仪器控制

    VISA仪器控制 / VISA Instrument Control 1 VISA简介 / VISA Introduction VISA(Virtual Instrument Software Arc ...

  2. 【模拟】Friday the Thirteenth

    题目描述 Is Friday the 13th really an unusual event?That is, does the 13th of the month land on a Friday ...

  3. 分享Kali Linux 2017年第23周镜像文件

    分享Kali Linux 2017年第23周镜像文件  Kali Linux官方于6月4日发布2017年的第23周镜像.这次维持了11个镜像文件的规模.默认的Gnome桌面的4个镜像,E17.KDE. ...

  4. Web/JAVA 简单题目汇总

    [Java标识符,变量.常量] 一.Java合法标识符命名规则 (1)区分字母大小写,标识符长度不限 (2)  英文,Unicode码双字节文字字符(日文,韩文,中文),数字,下划线,$(美元符号)均 ...

  5. 解读TDD的五大误区

    所谓TDD简单地说就是以下两个步骤:确保所有的需求都能被照顾到:在代码不断增加和重构的过程中,可以检查所有的功能是否正确.本文我们一起来看下关于TDD的五大误区. TDD(全称Test Driven ...

  6. Visual Studio Debug和Release的区别及obj的作用

    一.Debug和Release的区别      1.Debug:调试版本,包含调试信息,所以容量比Release大很多,并且不进行任何优化(优化会使调试复杂化,因为源代码和生成的指令间关系会更复杂), ...

  7. 理解ASP.NET 5 Web Apps

    来源https://docs.asp.net/en/latest/conceptual-overview/understanding-aspnet5-apps.html ASP.NET 5引入了几个新 ...

  8. spring-data-jpa动态条件查询

    //获取动态条件的集合List<Long> list = new ArrayList<Long>(); Long sysUserId = currentUser.getSysU ...

  9. 【Hive】Hive 安装&使用基础

    2 安装 2.1 参考 2.1.1 下载 2.1.1.1 https://mirrors.tuna.tsinghua.edu.cn/apache/hive/stable-2/ 2.1.2 安装指导 2 ...

  10. oracle sql试题

    转载 数据准备 create table student(  sno varchar2(10) primary key,  sname varchar2(20),  sage number(3),  ...