如何在嵌套列表中获取父元素li的值

How to get the value of the parent li in a nested list?

本文关键字：元素 li 的值 获取 嵌套 列表      更新时间：2023-09-26

你能帮我吗，我创建一个嵌套列表，像这样:

<ol>
   <li data-value="1">
        <ol>
           <li data-value="1"></li>
           <li data-value="2"></li>
           <li data-value="3"></li>
        </ol>
   </li>
   <li data-value="3"></li>
   <li data-value="3"></li>
</ol>

我怎么能得到数据值属性的父只?

输出示例:1、3、3

试试这个简单的方法:

$('ol > li').not('ol ol li').attr('data-value');

或在循环中:

$('ol > li').not('ol ol li').each(function() {
  console.log($(this).attr('data-value'));
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ol>
  <li data-value="1">
    <ol>
      <li data-value="1a"></li>
      <li data-value="2a"></li>
      <li data-value="3a"></li>
    </ol>
  </li>
  <li data-value="2"></li>
  <li data-value="3"></li>
</ol>

$('li').not('li ol li').each(function(){
console.log($(this).attr('data-value'))
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ol>
   <li data-value="1">
        <ol>
           <li data-value="1"></li>
           <li data-value="2"></li>
           <li data-value="3"></li>
        </ol>
   </li>
   <li data-value="3"></li>
   <li data-value="3"></li>
</ol>

试试这个

您应该找到最近的"父" li并找到它的data-value属性。

https://api.jquery.com/closest/

$(this).closest('li').attr('data-value');

你可以试试:

$(document).ready(function() {
  $("ol").first().find("> li").each(function() {
    console.log($(this).data("value"));
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
<ol>
  <li data-value="1">
    <ol>
      <li data-value="1"></li>
      <li data-value="2"></li>
      <li data-value="3"></li>
    </ol>
  </li>
  <li data-value="3"></li>
  <li data-value="3"></li>
</ol>

尝试使用jQuery .parents函数:

$(this).parents("[data-testing]:first");
相关文章：