在前端开发中，我们常常需要找到某个特定类名的元素，并获取其在同类元素中的索引位置。jQuery 是一个著名的 JavaScript 库，为我们提供了很多方便易用的 DOM 操作函数，其中包括获取元素索引的方法。
1. 使用 .index() 方法
jQuery 提供了 .index() 方法，可以返回匹配元素在同类元素中的索引值。例如：
-- -------------------- ---- ------- -- ---- -- ---- -------------- --- -------------------------- --------------- --- -------------------------- ----- -- ------ -- --- ----- - --------------------- ------------------- -- ----
上述代码中，我们先定义了一个包含四个列表项的无序列表。然后使用 jQuery 选择器选中了具有类名 "target" 的两个列表项元素，并使用 .index() 方法获取它们在同类元素中的索引位置。由于第二个目标元素是列表中的第二个元素，因此输出结果为 1。
需要注意的是，如果选中的元素不存在于父元素中，则 .index() 方法会返回 -1。因此，在使用该方法时，需要保证选中元素确实包含在所查询的元素列表中。
另外，该方法还可以接受一个参数，用于指定相对于指定元素的索引位置。例如：
-- -------------------- ---- ------- -- ---- -- ---- -------------- --- -------------------------- --------------- --- -------------------------- ----- -- ------ -- --- ----- - -------------------------------------- ------------------- -- ----
在上述示例中，我们传递了一个字符串参数 "li:nth-child(2)" 给 .index() 方法。这个参数指定了相对于当前查询元素的索引位置，即查询元素的前一个兄弟元素。由于第二个目标元素的前一个兄弟元素是列表中的第一个元素，因此输出结果为 0。
2. 总结
本文介绍了 jQuery 中获取特定类名元素索引值的方法—— .index()。通过该方法，我们可以快速、方便地获取目标元素在同类元素中的位置，并进行后续操作。实际开发中，该方法的应用场景非常多，例如制作轮播图、筛选列表等等。
希望本文能够帮助读者掌握这一实用的技巧，加深对 jQuery 的理解和应用。最后附上完整的示例代码：
-- -------------------- ---- -------
--------- -----
------
------
----- ----------------
------------- - --------------------
------- ----------------------------------------------------------------------------
-------
------
----
--------------
--- --------------------------
---------------
--- --------------------------
-----
--------
--- ------ - ---------------------
-------------------- -- ----
--- ------ - --------------------------------------
-------------------- -- ----
---------
-------
-------来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/29927