如何通過XMLHttpRequest從html頁面創建DOM對象？

我正在開發一個鉻擴展，所以我對於我要求的域的XMLHttpRequests擁有跨主機權限。如何通過XMLHttpRequest從html頁面創建DOM對象？

我已經使用了XMLHttpRequest並獲得了一個HTML網頁（txt/html）。我想使用XPath（document.evaluate）從中提取相關的位。不幸的是，我無法從html的返回字符串構造一個DOM對象。

var xhr = new XMLHttpRequest(); 
var name = escape("Sticks N Stones Cap"); 
xhr.open("GET", "http://items.jellyneo.net/?go=show_items&name="+name+"&name_type=exact", true); 
xhr.onreadystatechange = function() { 
    if (xhr.readyState == 4) { 
    var parser = new DOMParser(); 
    var xmlDoc = parser.parseFromString(xhr.responseText,"text/xml"); 
    console.log(xmlDoc); 
    } 
} 

xhr.send();

console.log將在Chromium JS控制檯中顯示調試內容。

在上述JS控制檯中。我得到這個：

Document 
<html> 
<body> 
<parsererror style="display: block; white-space: pre; border: 2px solid #c77; padding: 0 1em 0 1em; margin: 1em; background-color: #fdd; color: black"> 
<h3>This page contains the following errors:</h3> 
<div style="font-family:monospace;font-size:12px">error on line 1 at column 60: Space required after the Public Identifier 
</div> 
<h3>Below is a rendering of the page up to the first error.</h3> 
</parsererror> 
</body> 
</html>

因此，如何是我該使用XMLHttpRequest - >接收HTML - >轉換爲DOM - >使用XPath橫向？

我應該使用「隱藏的」iframe hack來加載/接收DOM對象嗎？

來源

2010-10-19 Dima

我使用IFRAME技術在我們的web應用程序中加載HTML。它速度很快，即使在IE8上也能正常運行。當你在DOM中時，你可以使用CSS選擇器代替Xpath。 – Mic 2010-10-19 21:44:39

@Mic謝謝。我會盡力解決這個問題。這只是我在做幾頁數據的屏幕截圖，XPath是一個真正的奇蹟=）允許你從任何表格中獲得所有類似的數據。 – Dima 2010-10-19 21:48:40

CSS選擇器是用於HTML的，Xpath是用於XML的，但多一點人力:) – Mic 2010-10-19 22:03:44

DOMParser在DOCTYPE定義上窒息。它也會出現任何其他非xhtml標記，例如<link>而沒有結束/。你有權控制正在發送的文件嗎？如果沒有，最好的辦法是把它解析爲一個字符串。使用正則表達式來查找您要查找的內容。

編輯：你可以在瀏覽器通過將其注入隱藏div來解析主體的內容對您：

var hidden = document.body.appendChild(document.createElement("div")); 
hidden.style.display = "none"; 
hidden.innerHTML = /<body[^>]*>([\s\S]+)<\/body>/i(xhr.responseText)[1];

現在搜索裏面hidden找到你要找的內容：

var myEl = hidden.querySelector("table.foo > tr > td.bar > span.fu"); 
var myVal = myEl.innerHTML;

來源

2010-10-19 21:53:53 gilly3

不，我無法控制正在發送的文檔。我有點困惑。對於同一個頁面，我可以獲得'document'對象，但是如果將它作爲字符串傳遞給我，我無法得到它？ – Dima 2010-10-19 22:10:20

直到它被瀏覽器解析，它只是一個字符串。爲了讓瀏覽器解析它，將html注入到頁面上的隱藏div中，然後在div中搜索你正在尋找的任何東西。 – gilly3 2010-10-19 22:23:58

如何通過XMLHttpRequest從html頁面創建DOM對象？

回答

相關問題