2017-06-18 74 views
-1

我試圖抓住標籤的源代碼,並使用Chrome擴展和jQuery來匹配標題和其他一些標籤。我看過類似的問題,目前爲止沒有任何工作。有人能幫助我嗎?它已經4個小時沒有成功。我只是需要的代碼來獲取源代碼,我會做休息...使用Chrome擴展和jQuery獲取源代碼

manifest.json的

{ 
    "name": "Importer", 
    "version": "0.1", 
    "manifest_version": 2, 
    "permissions": [ 
     "tabs" 
    ], 
    "browser_action": { 
     "default_icon": "icon.png", 
     "default_popup": "popup.html" 
    } 
} 

popup.js

/* 
* Popup v1.0.0 
*/ 
$(window).load(function() { 
    $("#import").click(function() { 
     $(".success").show(); 
    }); 
}); 

彈出.html

<!doctype html> 
<html> 
<head> 
    <meta charset="UTF-8" /> 
    <title>Importer</title> 
    <style> 
     .success { color: green; font-weight: bold; margin-top: 20px; display: none; } 
     .error { color: red; font-weight: bold; margin-top: 20px; display: none; } 
    </style> 
    <script type="text/javascript" src="jquery.min.js"></script> 
    <script type="text/javascript" src="popup.js"></script> 
</head> 
<body> 
    <h1>Importer</h1> 

    <button id="import">Import!</button> 

    <div class="success"> 
     <span>The product is imported!</span> 
    </div> 
    <div class="error"> 
     <span>The product is not imported!</span> 
    </div> 
</body> 
</html> 
+1

您需要使用[內容腳本]( https://developer.chrome.com/extensions/content_scripts)與網頁進行交互(例如,操縱DOM,聽取頁面上的點擊等)。我建議您閱讀[Chrome擴展程序概述](https://developer.chrome.com/extensions/overview)(可能還包括從概述鏈接的頁面)。 [體系結構部分](https://developer.chrome.com/extensions/overview#arch)具有全面的體系結構信息,這些信息應該有助於您理解組織/完成情況的方式。 – Makyen

+1

如果你的用戶交互*開始*用戶點擊'browserAction'按鈕,那麼內容腳本應該注入['chrome.tabs.executeScript()'](https://developer.chrome.com/extensions/ tabs#method-executeScript)而不是* manifest.json *'content_script'條目。這樣,您的內容腳本就不會因爲被注入到每個頁面而等待被使用而給瀏覽器造成負擔。使用'chrome.tabs.executeScript()',腳本可以在注入[數據(如果需要的話)已經傳遞給它的情況下]開始運行(http://stackoverflow.com/a/40815514/ 3773011)。 – Makyen

+0

「抓住標籤的源代碼」是什麼意思?您是否希望將標籤內容的HTML文本轉換爲彈出腳本?你想要做什麼「標籤的源代碼」? – Makyen

回答

0

您應該創建content_script,可以讓你訪問到整個DOM
在清單:

content_scripts": [ 
    { 
     "matches": ["http://*/*", "https://*/*"], 
     "js": ["content.js"] 
    } 
] 

content.js你可以寫正JS如:document.body.innerHTML

+0

只有在導入按鈕被點擊後,有沒有一種可能的方式(例如)console.log document.body.innerHTML? –

+0

在編程谷歌是你最好的朋友:https://stackoverflow.com/questions/20019958/chrome-extension-how-to-send-data-from-content-script-to-popup-html – Michael

+0

我剛纔看在那,但我決定從content.js做所有的東西。所以我只需要找到一種方法來觸發content.js導入按鈕被點擊後...... –