Select 子 div 中的信息 jQuery

Select infos in sub-divs with jQuery

我是 Safaribooksonline.com 的会员,我喜欢它。

现在我想保存我图书馆中的图书清单。

如果我查看书籍列表的 html 来源,我在 class "main".

中有像下面 [1] 这样的 div

我将 jQuery 加载到浏览器控制台,然后用 books_list = jQuery(".main") 选择了所有 "main" div。这给了我一个对象,其中包含 Object { 0: <div.main>, 1: <div.main> ... 之类的条目。

我可以遍历这些条目并提取子信息(书名等)。

从这些主要 div 中获取子 div 和子信息的最惯用方法是什么?最好采用 JSON 格式。这样我就有 {title: "book title", author: "book author", etc}


[1] 包含图书信息的 Div

<div class="main">
  <span class="cover">
    <a href="/library/view/learning-javascript-design/9781449334840/">
      <span><img src="/library/cover/9781449334840/"></span>
    </a>
  </span>

  <a href="/library/view/learning-javascript-design/9781449334840/" class="next title-block js-bit-title t-bit-link">
    <span class="chapter-title t-bit-title">Learning JavaScript Design Patterns</span>
  </a>
  <span class="book-title">
    <span class="author">by Addy Osmani</span>
    <span class="issued">Released: August 2012</span>
  </span>

  <div class="t-read-link prog-text">
    <a href="/library/view/learning-javascript-design/9781449334840/index.html" class="button position-link t-position-link js-position-book">Start reading now</a>
  </div>

  <div class="book-topics">
    <ul class="topic-display">
  <li><a href="/topics/design-patterns" class="topic t-t-link" data-topic-slug="design-patterns">Design Patterns</a></li>
    </ul>
  </div>
</div>

尝试 $().each:

Iterate over a jQuery object, executing a function for each matched element.

例如:

jQuery(".main").each(function() {
    // do something with each div, access them using $(this)
});