jquery .eq

jQuery .eq() 方法

jQuery 的 .eq() 方法用于从匹配的元素集合中获取指定索引位置的元素。该方法返回一个新的 jQuery 对象，包含集合中指定索引位置的元素。

语法

$(selector).eq(index)

• index：一个整数，表示元素的索引位置（从 0 开始）。如果为负数，则从集合末尾开始倒数（例如，-1 表示最后一个元素）。

示例

选择第一个 <li> 元素：

$("li").eq(0).css("color", "red");

选择最后一个 <li> 元素：

$("li").eq(-1).css("color", "blue");

与 .get() 的区别

• .eq() 返回一个 jQuery 对象，可以继续链式调用其他 jQuery 方法。
• .get() 返回一个 DOM 元素，无法直接调用 jQuery 方法。

示例对比：

// 使用 .eq()，可以继续链式调用
$("li").eq(1).css("color", "green");

// 使用 .get()，返回 DOM 元素
$("li").get(1).style.color = "yellow";

实际应用场景

• 动态操作表格中的某一行。
• 轮播图中切换到特定幻灯片。
• 从一组元素中筛选特定位置的元素进行样式或内容修改。

注意事项

• 如果索引超出范围（例如大于等于集合长度或小于负的集合长度），.eq() 会返回一个空的 jQuery 对象。
• 结合其他 jQuery 方法（如 .filter() 或 .slice()）可以更灵活地操作元素集合。

链式调用示例

$("div")
  .eq(2)
  .addClass("highlight")
  .fadeOut(1000);