如何使用Google擴展程序查找網址的div標籤

Question

我正在創建一個可以查找指定網址的所有div標籤的Chrome擴展程序。不過，我一直很困惑如何解決這個問題。我應該使用內容腳本嗎？如果可以，我如何可靠地將標籤數量傳遞給我的背景頁面？另外，是否可以在我的背景html頁面上使用XMLHttpRequest來查找url中的div標籤？

Answer 1

如果這是您唯一的要求，請從指定的公開網址中查找div標籤，然後您可以像上面所說的那樣在帶有XHR的background.html頁面中執行此操作。

事情是這樣的：

var xhr = new XMLHTTPRequest(); 
... 
xhr.send(null); 
var query = xhr.responseXML.querySelectorAll('div'); 
console.log('You have found ' + query.length + ' DIV tags!'; 

我這樣做之前閱讀了一堆的RSS鏈接，請確保您的響應類型是XML，以及確保你從XHR那麼responseXML的優勢。或者你可以只使用DOMParser類，做

var parser = new DOMParser(); 
// Maybe you have to play with text/xml 
var dom = parser.parseFromString(xhr.responseText, "text/xml") 
var query = dom.querySelectorAll('div'); 
console.log('You have found ' + query.length + ' DIV tags!'; 

如果你的內容是動態的，你想在那時刻得到的DIV的列表中，那麼你必須使用一個內容腳本，注入只是這樣的：

document.body.querySelectorAll('div'); 
console.log('You have found ' + query.length + ' DIV tags!'; 

我假設你想要的用戶觸發，所以看看Extension Message Passing看你怎麼可以擴展到內容腳本發送消息，所以你可能會觸發此。

希望能幫助你一點！