index() 方法

原创已于 2022-04-01 17:26:17 修改 · 372 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#jquery

于 2022-04-01 17:25:01 首次发布

这篇博客探讨了jQuery中$.index()函数的用法，包括获取元素在父元素中的索引值以及在特定集合中的位置。通过示例代码展示了如何在点击事件中动态获取选中项的索引，并分析了不同参数情况下函数的行为。

<div class="div-t">
	<span></span>
	<ul>
		<li>AAA</li>
		<li>BBB</li>
		<li class="selected">CCC</li>
		<li>DDD</li>
		<li>EEE</li>
	</ul>
</div>



<script>

	$(function(){


		$(".div-t").on("click", "li", function(){
			// 参数为空，返回调用者在其父元素中的索引值；严格来说，是 调用者 在 父元素的所有直接子元素的集合 中的索引值
			var index = $(this).index();
			index = $(this).parent().index();

			// 参数为字符串，则将字符串视为集合选择器，即 参数 为 集合，返回 调用者 在 参数集合 中的索引值
			// 可将 参数为空 视为 参数为字符串 的默认情况，即默认 集合为 父元素的所有直接子元素的集合
			index = $(this).index(".div-t li");			

			// 参数为对象，则 调用者 为 集合，返回 对象 在 集合 中的索引值
			index = $(".div-t li").index($(this));
			index = $(".div-t li").index($(".selected"));

			console.log(index);
		});

	}

</script>