javascript - Chrome扩展禁用js触发器

Question

我制作了一个 Chrome 扩展程序，可以在当前页面中注入(inject)一些代码。 不过，这个扩展有一个奇怪的行为，每当注入(inject)代码时，页面的 Javascript 触发器似乎都不再起作用。

你们中有人知道会发生什么吗？除了修复代码之外，我真的很想知道为什么会发生这种情况。

示例:在此页面上:http://www.acti.fr/success-story/ghd/如果扩展程序注入(inject)图片，我无法单击底部的菜单或“继续讲课”。

以下是 list 和实际代码:

list .json

{
    "manifest_version": 2,

        "name": "wpi",
        "description": "just an other extension",
        "version": "1.0",
        "content_scripts": [{
            "matches": ["http://*/*", "https://*/*"],
            "js": ["my-style.js"]
        }]
}

我的脚本.js:

function wpkm_check_content(wpkm_text) {
    var wpkm_word = wpkm_text.split(" ");
    var wpkm_c = wpkm_word[0].localeCompare("Wordpress");
    if (wpkm_c == 1)
        return (1);
    return (0);
}
var wpkm_html = '<div id="wpkm-bloc" style="position:absolute;right:10px;top:10px;z-index:99999">';
wpkm_html += '<img id="wpkm-img" src="https://nathanarnold.files.wordpress.com/2009/02/ssim51.gif">';
wpkm_html += '</div>';
var wpkm_sdomain = document.domain;
var wpkm_request = new XMLHttpRequest();
wpkm_request.open('GET', '/license.txt', true);
wpkm_request.onreadystatechange = function(){
    if (wpkm_request.readyState === 4){
        if (wpkm_request.status === 200
                && wpkm_check_content(wpkm_request.responseText) == 1) {
            document.body.innerHTML += wpkm_html;
        }
        else {
            console.log("Oh no, it does not exist!");
        }
    }
};
wpkm_request.send();

任何提示将不胜感激:D

Answer 1

您可以使用 += 附加运算符有效地重新分配文档正文的整个 insideHTML，这会导致重新评估和重新创建整个页面，当然还有之前附加的所有页面事件处理程序不会自动重新附加。

使用insertAdjacentHTML相反:

document.body.insertAdjacentHTML("beforeend", wpkm_html);