jQuery从类中的所有元素获取属性和值

我刮了一个网站，它有以下的HTML结构

<div id="list" class="book-list"> <div id="stream_1" class="stream collapsed"> <h3 id="s-1" rel="1"><div><a name="st_1" class="st st_1">Version 1</a></div></h3> <div class="volume last"> <h4 id="v-1-1">Volume 1<span class="range">Chapter 1</span></h4> <ul class="chapter"> <li id="b-922893" class="new"> <span> <a class="ch sts sts_1" target="_blank" href="link/1">vol.1 ch.1</a> </span> <i>Yesterday 08:27 am</i> <em> <a href="link/1" target="_blank">1</a> <a href="link/3-1" target="_blank">3</a> <a href="link/6-1" target="_blank">6</a> <a href="link/10-1" target="_blank">10</a> <a href="link" target="_blank">all</a> of 44 </em> </li> </ul> </div> </div> <div id="stream_5" class="stream"> <h3 id="s-5" rel="5"><div><a name="st_5" class="st st_5">Version 2</a></div></h3> <div class="volume last"> <h4 id="v-5-">Volume <i>[Null]</i><span class="range">Chapter 1</span></h4> <ul class="chapter"> <li id="b-922873" class="new"> <span> <a class="ch sts sts_5" target="_blank" href="links5/c1/1">ch.1</a> </span> <i>Yesterday 08:10 am</i> <em> <a href="links5/c1/1" target="_blank">1</a> <a href="links5/c1/3-1" target="_blank">3</a> <a href="links5/c1/6-1" target="_blank">6</a> <a href="links5/c1/10-1" target="_blank">10</a> <a href="links5/c1" target="_blank">all</a> of 44 </em> </li> </ul> </div> </div> </div> 

我想要使​​用jQuery来从div的链接得到这样的东西

 { "vol.1 ch.1" : "link/1", "ch.2" : "link/2" } 

因为我想要的所有项目都有类，所以我想让它们与select器，并尝试使用each()但没有工作，因为它显示节点…

以下是我如何尝试：

 $d('.ch').map(function(){ console.log('This: href',$(this).attr("href")); }).get(); 

Answer 1

这比你想象的更简单。 既然你已经提到你只想分析链接的类，我改变了select器。

 var map = {}; $(".ch.sts").each(function() { map[$(this).text()] = $(this).attr("href"); }); console.log(map); 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <div id="list" class="book-list"> <div id="stream_1" class="stream collapsed"> <h3 id="s-1" rel="1"><div><a name="st_1" class="st st_1">Version 1</a></div></h3> <div class="volume last"> <h4 id="v-1-1">Volume 1<span class="range">Chapter 1</span></h4> <ul class="chapter"> <li id="b-922893" class="new"> <span> <a class="ch sts sts_1" target="_blank" href="link/1">vol.1 ch.1</a> </span> <i>Yesterday 08:27 am</i> <em> <a href="link/1" target="_blank">1</a> <a href="link/3-1" target="_blank">3</a> <a href="link/6-1" target="_blank">6</a> <a href="link/10-1" target="_blank">10</a> <a href="link" target="_blank">all</a> of 44 </em> </li> </ul> </div> </div> <div id="stream_5" class="stream"> <h3 id="s-5" rel="5"><div><a name="st_5" class="st st_5">Version 2</a></div></h3> <div class="volume last"> <h4 id="v-5-">Volume <i>[Null]</i><span class="range">Chapter 1</span></h4> <ul class="chapter"> <li id="b-922873" class="new"> <span> <a class="ch sts sts_5" target="_blank" href="links5/c1/1">ch.1</a> </span> <i>Yesterday 08:10 am</i> <em> <a href="links5/c1/1" target="_blank">1</a> <a href="links5/c1/3-1" target="_blank">3</a> <a href="links5/c1/6-1" target="_blank">6</a> <a href="links5/c1/10-1" target="_blank">10</a> <a href="links5/c1" target="_blank">all</a> of 44 </em> </li> </ul> </div> </div> </div> 

Answer 2

1. 获取所有与类名称的元素。
2. 获取文本值和“href”属性。

 x = document.getElementsByClassName("ch sts"); for(i =0; i<x.length; i++) { console.log(x[i].text +" "+ x[i].getAttribute("href")); }