首页 > 代码库 > $(obj).index(this)与$(this).index()异同讲解
$(obj).index(this)与$(this).index()异同讲解
$(this).index()在使用jQuery时出镜率非常高，在编写选项卡及轮播图等特效时经常用到，但$(obj).index(this)似乎有点陌生。
为便于理解，以下分两个使用场景加以分析。
场景一： 同级元素标签相同
<ul> <li>one</li> <li>two</li> <li>three</li> <li>four</li> </ul>
<script> // $(this).index() 测试代码一 $("li").on("click",function(){ var index = $(this).index(); console.log(index); // 依次点击li元素输出： 0,1,2,3 }) // $(obj).index(this) 测试代码二 $("li").on("click",function(){ var index = $("li").index(this); console.log(index); // 依次点击li元素输出： 0,1,2,3
}) </script>执行两段脚本并依次点击li元素，都是输出： 0/1/2/3，在这个场景下，作用一样。
场景二：同级元素标签不相同
<div> <p>this is span</p> <p>this is span</p> <b>this is b</b> <b>this is b</b> </div>
<script> // $(this).index() 测试代码一 $("b").on("click",function(){ var index = $(this).index(); console.log(index); // 依次点击b元素输出:2,3 }) // $(obj).index(this) 测试代码二 $("b").on("click",function(){ var index = $("b").index(this); console.log(index); // 依次点击b元素输出:2,3 })</script>
测试代码一中，index()是元素在当前同级元素中的位置下标，不区分标签；
测试代码二中，返回值是当前操作元素（this）在$（"b"）集合中的下标。（$( "b" )是jQuery对象集合，所以非同级元素也可以使用，有兴趣自己可以测试）
$(obj).index(this)与$(this).index()异同讲解
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。