从Divs中获取数据

Question

我有以下结构：

<div id="main">
  <div id="myDiv1">
    <ul>
      <li>Abc</li>
      <li>Def</li>
    </ul>
  </div>
  <div id="myDiv2">
    <ul>
      <li>Ghi</li>
      <li>Jkl</li>
    </ul>
  </div>
</div>

可以有多个myDivX。

我想通过以下方式获取一些信息：

myDiv1
Abc
Def
myDiv2
Ghi
Jkl

这是我的方法：

$("#main").each(function() {
  $("div").each(function() {
    console.log(this.id)
  });
  $("ul").each(function() {
    console.log(this)
  });
});

它给了我这个：

main
myDiv1
myDiv2
<ul>​<li>​Abc​</li>​<li>​Def​</li>​</ul>​
<ul>​<li>​Ghi​</li>​<li>​Jkl​</li>​</ul>​

Fiddle

Answer 1

你可以这样做DEMO

$('#main div').each(function() {
  console.log($(this).attr('id'));
  $(this).find('li').each(function() {
    console.log($(this).text());
  });
});

Answer 2

在div #main下的子DOM树上运行Depth-First-Search按顺序遍历。

Nick Zakas有一篇关于如何在Javascript中编写此函数的精彩文章：https://www.nczonline.net/blog/2009/06/09/computer-science-in-javascript-binary-search-tree-part-1/

Answer 3

$("div").each(function() {
    If($(this).attr("id").indexOf("myDiv") < 0)
    {
        return;
    }
    console.log(this.id)
});