Question

遍历嵌套的div元素以获取标签文本的最佳方法是什么？

<div id="parent">
  <div id="div0">
    <span class="ui-icon"></span>
    <label>some data</label>
  </div>
  <div id="div1">
    <span class="ui-icon"></span>
    <label>some data1</label>
  </div>
  <div id="div2">
    <span class="ui-icon"></span>
    <label>some data2</label>
  </div>
</div>

尝试类似以下操作，但变得不确定，

$('#parent > div > span > label').each(function () {
                    console.log($(this).value); // "this" is the current element in the loop
 });

Answer 1

您有两个问题：

1）您的选择器正在寻找label的兄弟姐妹span的子代。改用sibling combinator

2）标签没有value，它们有innerHtml，textContent等。对于jquery，您想使用.text();

$(document).ready(function() {
  $('#parent > div > span + label').each(function() {
    console.log($(this).text()); // "this" is the current element in the loop
  });
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="parent">
  <div id="div0">
    <span class="ui-icon"></span>
    <label>some data</label>
  </div>
  <div id="div1">
    <span class="ui-icon"></span>
    <label>some data1</label>
  </div>
  <div id="div2">
    <span class="ui-icon"></span>
    <label>some data2</label>
  </div>
</div>

循环通过嵌套的DIV元素

1 个答案: