0
我正在做一些需要自動生成元素ID的實驗,我決定使用chrome擴展。chrome.browserAction.onClicked無法觸發
但是,內容腳本僅在登陸該網站的主頁時觸發(例如https://secure.checkout.visa.com/)。一旦我導航到其他頁面(例如點擊「創建帳戶」),該腳本沒有被觸發,我試圖在內容腳本上設置一個斷點,但它只在主頁上觸發,但不在創建帳戶上頁。
有什麼想法這裏出了什麼問題?下面是代碼:
// manifest.json
{
"manifest_version": 2,
"name": "Chrome Auto Gen ID",
"description": "Generate IDs",
"version": "1.0",
"permissions": ["activeTab"],
"background": {
"scripts": ["event_page.js"],
"persistent": false
},
"browser_action": {
"default_title": "Auto generate ID"
},
"content_scripts": [
{
"matches": ["https://secure.checkout.visa.com/*"],
"js": ["jquery-3.2.1.min.js", "auto_gen_id.js"],
"all_frames": true,
"run_at": "document_idle"
}
]
}
內容腳本:
// auto_gen_id.js
var divs = document.getElementsByTagName("div");
var inputs = document.getElementsByTagName("input");
var sections = document.getElementsByTagName("section");
var count = 0;
function genId(list) {
for (var i = 0; i < list.length; ++i) {
var element = list[i];
if (element.hasAttribute("id")) {
continue;
}
element.id = "gen-id-" + count++;
}
}
genId(divs);
genId(inputs);
後臺腳本:
// event_page.js
chrome.browserAction.onClicked.addListener(function(tab) {
console.log('Generating IDs on ' + tab.url);
chrome.tabs.executeScript(null, {file: "auto_gen_id.js"});
});
這聽起來像你試圖修改的頁面是一個「單頁網站」。這意味着它僅使用一個實際頁面和AJAX來加載新內容,而不是實際加載新頁面。我不打算去現場確認,但你的問題是典型的這樣的網頁。請參閱:[是否存在JavaScript/jQuery DOM更改偵聽器?](https://stackoverflow.com/a/39508954),以瞭解檢測頁面更改時間的方法。 – Makyen
除了上述評論之外,您還需要兩次注入內容腳本 - 點擊並通過manifest.json中的聲明自動運行指定的內容腳本。 – wOxxOm