当前位置:首页 > jquery

jquery 索引

2026-03-02 18:07:12jquery

jQuery 索引方法

jQuery 提供了多种方法来获取元素在集合中的索引位置,以下是常用的索引操作方法:

index() 方法

index() 方法返回指定元素相对于其同级元素的索引位置。如果不传递参数,返回当前元素在其兄弟元素中的位置;如果传递选择器或 DOM 元素,返回该元素在匹配集合中的索引。

语法:

$(selector).index()
$(selector).index(element)

示例:

// 获取当前元素在兄弟元素中的索引
$("li").click(function() {
  alert($(this).index());
});

// 获取元素在特定集合中的索引
var index = $("#item").index("li");

eq() 方法

eq() 方法从匹配的集合中获取指定索引位置的元素。索引从 0 开始,负数表示从末尾开始计数。

语法:

$(selector).eq(index)

示例:

// 获取第二个 li 元素
$("li").eq(1).css("color", "red");

// 获取倒数第一个 li 元素
$("li").eq(-1).css("font-weight", "bold");

:eq() 选择器

:eq() 选择器直接匹配指定索引位置的元素,与 eq() 方法功能类似,但作为选择器使用。

语法:

$("selector:eq(index)")

示例:

// 选中第二个 li 元素
$("li:eq(1)").addClass("highlight");

遍历方法中的索引

jQuery 的遍历方法(如 each())会传递索引参数给回调函数。

示例:

$("li").each(function(index) {
  console.log("Index: " + index + ", Text: " + $(this).text());
});

注意事项

  • index() 方法返回的是基于 0 的索引,未找到元素时返回 -1。
  • eq():eq() 的索引支持负数,表示从末尾开始计数。
  • 使用遍历方法时,索引参数通常是回调函数的第一个参数。

jquery 索引

标签: 索引jquery
分享给朋友:

相关文章

jquery下载

jquery下载

jQuery下载方法 官方下载渠道 访问jQuery官网(https://jquery.com/),点击页面中的“Download”按钮。提供两个版本选择: Production版本:压缩后的…

jquery教程

jquery教程

jQuery 教程:基础与实用方法 jQuery 简介 jQuery 是一个快速、简洁的 JavaScript 库,简化了 HTML 文档遍历、事件处理、动画和 Ajax 交互。其核心特点是“写得更少…

jquery和vue的区别

jquery和vue的区别

核心设计理念 jQuery是一个基于DOM操作的轻量级JavaScript库,主要用于简化HTML文档遍历、事件处理、动画设计等任务。它采用命令式编程风格,需要手动操作DOM元素。 Vue是一个渐进…

jquery页面

jquery页面

jQuery 页面操作指南 jQuery 是一个快速、简洁的 JavaScript 库,简化了 HTML 文档遍历、事件处理、动画和 Ajax 交互的操作。以下是 jQuery 在页面中的常见使用方法…

jquery判断

jquery判断

jQuery 判断元素存在与属性方法 使用 jQuery 判断元素是否存在可通过检查选择器返回的 jQuery 对象长度: if ($('#elementId').length > 0) {…

jquery数组

jquery数组

jQuery 数组操作 jQuery 提供了多种方法来操作数组或类数组对象(如 jQuery 对象集合)。以下是常见的数组操作方法: 遍历数组 使用 $.each() 方法可以遍历数组或对象:…