jQuery杂项index()方法



jQuery中的index()方法用于查找元素在其同级元素中的索引位置。

它通常用于确定元素在一组匹配元素中的位置。此方法返回一个整数,表示元素的索引位置,从0开始。如果找不到元素,则返回-1。

语法

以下是获取(相对于其同级元素的第一个匹配选择元素的索引位置)的此方法的语法:

$(selector).index()

以下是获取(相对于选择器的元素的索引位置)的此方法的语法:

$(selector).index(element)

参数

以下是上述语法的描述:

  • element(可选):一个DOM元素、一个jQuery对象或一个表示要查找的元素的选择器字符串。

示例1

在下面的示例中,我们使用jQuery杂项index()方法来获取被点击的列表项在其同级元素中的索引位置:

<html>
<head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
    <script>
        $(document).ready(function(){
            $("li").click(function(){
                var index = $(this).index();
                alert("Index of clicked list item: " + index);
            });
        });
    </script>
</head>
<body>
    <ul>
        <li>Item 1</li>
        <li>Item 2</li>
        <li>Item 3</li>
        <li>Item 4</li>
    </ul>
</body>
</html>

执行上述程序后,点击项的索引值将通过alert显示。

示例2

在这里,我们检索一组匹配元素中特定元素的索引位置:

<html>
<head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
    <script>
        $(document).ready(function(){
            var listItems = $("li");
            var specificItem = $("#item3");
            var index = listItems.index(specificItem);
            alert("Index of the specific item: " + index);
        });
    </script>
</head>
<body>
    <ul>
        <li id="item1">Item 1</li>
        <li id="item2">Item 2</li>
        <li id="item3">Item 3</li>
        <li id="item4">Item 4</li>
    </ul>
</body>
</html>

执行上述程序后,将检索id="item3"的元素,并通过alert显示。

jquery_ref_miscellaneous.htm
广告