Question

我想迭代一些HTML元素并获取它们的值。我尝试使用$.each()，但是当元素中包含其他变量类型元素时，我无法弄清楚如何做到这一点。我有HTML DOM结构：

<li>
 <div>X</div>
 <br/>
 <span>Category : </span>
 <div>Y</div>
 <span><br/>Rating</span>
 <div>
 <span>Z</span>
</div>

我想从中检索值X , Y , Z。此外还有多个实例，因此我将不得不遍历每个实例。任何人都可以建议一些方法吗？

Answer 1

您好像正在阅读text中所有div元素的li内容。所以试试

$('li').children('div').each(function(){
    console.log($(this).text())
})

Answer 2

将您感兴趣的元素分配给class：

<li>
 <div class="value">X</div>
 <br/>
 <span>Category : </span>
 <div class="value">Y</div>
 <span><br/>Rating</span>
 <div>
 <span class="value">Z</span>
</div>

然后按类选择值：

$('.values').each(function() {
  console.log($(this).text())
})

Answer 3

或

$('li > div').each(function(){
    console.log($(this).text())
})

- 编辑 -

如果您不希望这些内容中包含任何内容，可以尝试：

$('li > div').each(function(){
      var $tmp =  $(this).clone();
      $tmp.find('span').remove();
      console.log($tmp.text());

})

如何迭代一组异构元素？

3 个答案: