jQuery获取当前元素是该父元素的第几个元素&获取父元素的第n个子元素

  1. <div class="demo">  
  2.     <ul>  
  3.         <li>第一个元素</li>  
  4.         <li>第二个元素</li>  
  5.         <li>第三个元素</li>  
  6.         <li>第四个元素</li>  
  7.     </ul>  
  8. </div>  

一、jQuery获取当前元素是该父元素的第几个元素
index() 方法返回指定元素相对于其他指定元素的 index 位置。
这些元素可通过 jQuery 选择器或 DOM 元素来指定。
注释:如果未找到元素,index() 将返回 -1

  1. <script>  
  2. $(function(){  
  3.     $(".demo ul li").click(function(){  
  4.         var index=$(".demo ul li").index(this);  
  5.         console.log("当前下标为:"+index);   //注意:这里的下标从零开始  
  6.     });  
  7. });  
  8. </script>  

  二、jQuery获取父元素的第n个子元素
jQuery有多种方式获取父元素的第n个子元素,具体方法如下所示:

  1. <script>  
  2. $(function(){  
  3.     var val1=$(".demo ul li:nth-child(1)").text();   //注意:这里的下标从一开始,或者使用:first-child  
  4.     console.log(val1);  
  5.   
  6.     var val2=$(".demo ul li:first-child").text();  
  7.     console.log(val2);  
  8.   
  9.     var val3=$(".demo ul li").first().text();    //注意:这里的方法只有first()和last()  
  10.     console.log(val3);  
  11.   
  12.     var val4=$(".demo ul").find("li").get(0);    //注意:这里的下标从零开始  
  13.     console.log($(val4).text());  
  14.   
  15.     var val5=$(".demo ul li").eq(0).text();  
  16.     console.log(val5);  
  17. });  
  18. </script>  
原文地址:https://www.cnblogs.com/wssdx/p/8421202.html