Question

说我有：

<ul>
  <li></li>
  <li>
    <div id="test"></div>
  </li>
  <li></li>
</ul>

有没有办法告诉div标记它是什么号码li？

即。在div中有一个返回2的javascript函数，因为它位于第二个li元素内。

我意识到我可以去：

获取父ul
检查每个li孩子，直到找到div。

有更优雅的方法吗？

Answer 1

您可以使用jQuery index()

的不同变体

 $('li').index( $('li:has(div)') );

或

 $('li:has(div)').index();

demo

Answer 2

您可以使用jQuery .find();之类的内容：

<ul class="level-1">
  <li class="item-i">I</li>
  <li class="item-ii">II
      <div class="text">this is the div</div>
    </li>
      <li class="item-c">C</li>
  <li class="item-iii">III</li>
</ul>

$（＆＃34; ul.level-1＆＃34;）。find（＆＃34; div＆＃34;）。css（＆＃34; background-color＆＃34;，＆＃34; yellow＆＃ 34;）;

取决于你需要的......

Answer 3

您可以使用.index()获取li的索引，因为索引为零，因此为其添加1以获得2

var $div = $('#test')
var index = $div.parent().index() + 1

确定div所在的li元素数

3 个答案: