jQuery :eq() 选择器

目的：:eq() 选择器用于选择匹配元素集中指定索引处的元素。索引：索引从 0 开始，这意味着第一个元素的索引为 0。用法：当您需要根据元素在组中的位置来定位特定元素时，它非常有用。返回值：返回一个包含指定索引处元素的 jQuery 对象。

语法

以下是 jQuery :eq() 选择器的语法：

$(":eq(index)")

参数

以下是上述语法的描述：

index：要选择的元素的基于零的索引。

示例 1

在下面的示例中，我们使用 jQuery :eq() 选择器来选择索引为“2”的段落元素：

<html>
<head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
    <script>
        $(document).ready(function(){
            $("p:eq(2)").css("background-color", "yellow");
        });
    </script>
</head>
<body>
    <p>Paragraph 1</p>
    <p>Paragraph 2</p>
    <p>Paragraph 3</p>
    <p>Paragraph 4</p>
</body>
</html>

执行上述程序后，索引为“2”的段落元素将以黄色背景突出显示。

示例 2

在此示例中，我们选择索引为“1”的列表项：

<html>
<head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
    <script>
        $(document).ready(function(){
            $("li:eq(1)").css("background-color", "yellow");
        });
    </script>
</head>
<body>
    <ul>
        <li>List Item 1</li>
        <li>List Item 2</li>
        <li>List Item 3</li>
        <li>List Item 4</li>
    </ul>
</body>
</html>

执行上述程序后，索引为“1”的列表项将以黄色背景突出显示。

示例 3

在这里，我们选择索引为“3”的 <div> 元素：

<html>
<head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
    <script>
        $(document).ready(function(){
            // Select and hide the fourth div element (index 3)
            $("div:eq(3)").hide();
        });
    </script>
</head>
<body>
    <div>Div 1</div>
    <div>Div 2</div>
    <div>Div 3</div>
    <div>Div 4</div>
</body>
</html>

执行上述程序后，选定的元素将以黄色背景突出显示。

jquery_ref_selectors.htm

打印页面