使用Javascript - 解析HTML字符串得到的類X的每個元素並返回它們

Question

嗨的陣列我需要把成JSON的使用純JavaScript（無jQuery的）元素文本內容的巨大腫塊，然後把它們放入一個JSON數組。

例如來自：

<li class="asd">1</li> 
<li class="asd">2</li> 
<li class="asd">3</li> 
<li class="asd">4</li> 
<li class="asd">5</li> 
<li class="asd">6</li> 
<li>no</li> 
<li>no</li> 
<li>no</li> 
<li>no</li> 

我需要返回：

{[1,2,3,4,5,6]} 

因此，例如，我通過XHR得到一個HTML頁面內容一旦我得到的html頁面的字符串，我如何解析並把所有與class="asd"元素成JSON陣列？

這裏是我得到的HTML字符串：

var xhr = new XMLHttpRequest(); 
    xhr.onreadystatechange = function() { 
     if (xhr.readyState == 4) { 
      alert(xhr.responseText); 
//here i don't know how to parse the html returned :(and put it into a json array 
     } 
    } 
    xhr.open('GET', 'http://site.com/htmlpagecontent.html', true); 
    xhr.send(null); 

Answer 1

你可以通過創建一個虛擬的DOM元素，注入你的HTML字符串到這個元素。這將創建相應的節點層次結構，您可以使用getElementsByClassName進行過濾：

var div = document.createElement("div"); 
div.innerHTML = xhr.responseText; 
var nodes = div.getElementsByClassName("asd"); 
var array = []; 
for(var i=0; i<nodes.length; i++) { array.push(nodes[i].innerHTML); }