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. (25)C#windows服务

    http://www.cnblogs.com/knowledgesea/p/3616127.html http://jingyan.baidu.com/article/fa4125acb71a8628 ...

  2. Python的程序结构[2] -> 类/Class[1] -> 基类与继承

    基类与继承 / Base Class and Inheritance Class 面向对象的特性使得 Python 中不可避免地需要使用到类和类的继承,类的继承可以使得代码很好的被重用.下面以一些代码 ...

  3. 磁盘镜像工具Guymager

    磁盘镜像工具Guymager   在数字取证中,经常需要对磁盘制作镜像,以便于后期分析.Kali Linux提供一款轻量级的磁盘镜像工具Guymager.该工具采用图形界面化方式,提供磁盘镜像和磁盘克 ...

  4. Linux基本命令参数

    简单复习一下基本命令的参数 1.mkdir 两个参数: -p 递归创建该目录 mkdir -p /user/hadoop/test/raid -m 指定权限   mkdir -m 777 /raid ...

  5. luogu P2828 Switching on the Lights(开关灯)

    题目背景 来源:usaco-2015-dec Farm John 最近新建了一批巨大的牛棚.这些牛棚构成了一个N*N的矩形网络.(1<n<100) 然而bessie十分怕黑,他想计算可以把 ...

  6. C语言基础之for循环的使用

    一.for循环格式. 1: for (语句1; 条件; 语句2) 2:   3: { 4:   5: 循环体 6:   7: } 8:   9: 具体: 10:   11: 语句1:初始化语句 12: ...

  7. intellij idea 分屏设置 与快捷键

    1.找到分屏功能 File -> setting -> keymap,搜索(注意大小写):   Split Vertically 水平分屏   Split Horizontally 垂直分 ...

  8. 使用 SVG 来实现波浪 (wave) 动画效果

    如下图所示的波浪动画效果,实现方法有很多,比如CSS或者是js等方法都可以实现.不过,要是使用SVG来实现的,我觉得比其它两种方法都要简单.这篇文章就来讲讲使用SVG来实现类似这样的波浪动画效果是多么 ...

  9. 安装docker-compose的两种方式

    这里简单介绍下两种安装docker-compose的方式,第一种方式相对简单,但是由于网络问题,常常安装不上,并且经常会断开,第二种方式略微麻烦,但是安装过程比较稳定 方法一: # curl -L h ...

  10. 关于container_of和list_for_each_entry 及其相关函数的分析

    Linux代码看的比较多了,经常会遇到container_of和list_for_each_entry,特别是 list_for_each_entry比较多,因为Linux经常用到链表,虽然知道这些函 ...