如何在页面的 Javascript 执行后加载内容脚本?

2024-01-18

我的扩展应该仅在其注入的页面已完全加载之后加载内容脚本 searchTopic.js(是的,我已在扩展清单中将“run_at”设置为“document_end”),但实际上它是在之前加载的所有 DOM 对象都已创建(关键的对象是通过页面中的一些 Javascript 创建的)。那么,问题是,如何才能等到页面的 Javascript 执行完毕?这是我的清单:

"content_scripts": [
  {
  "run_at": "document_end",
  "matches": ["https://groups.google.com/forum/*"],
  "js": ["searchTopic.js"]
  }
],

"run_at": "document_end"相当于DOMContentLoaded. http://developer.chrome.com/extensions/content_scripts.html#run_at也就是说,它在staticHTML 已加载,但在缓慢的图像和缓慢的完成 JavaScript 之前。

因此,您不能仅通过单独设置清单来设置在页面 JS 之后触发的内容脚本。您必须在内容脚本本身中为此编写代码。

对于内容脚本,"run_at": "document_end"将在onload事件(与默认的document_idle——它可能会在不可预测的时间触发)。

所以,第一步就是等待load在您的内容脚本中使用类似代码的事件(searchTopic.js):

window.addEventListener ("load", myMain, false);

function myMain (evt) {
    // DO YOUR STUFF HERE.
}


如果您关心的脚本需要一段时间才能完成,您将必须根据具体情况轮询某些条件。例如:

window.addEventListener ("load", myMain, false);

function myMain (evt) {
    var jsInitChecktimer = setInterval (checkForJS_Finish, 111);

    function checkForJS_Finish () {
        if (    typeof SOME_GLOBAL_VAR != "undefined"
            ||  document.querySelector ("SOME_INDICATOR_NODE_css_SELECTOR")
        ) {
            clearInterval (jsInitChecktimer);
            // DO YOUR STUFF HERE.
        }
    }
}
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何在页面的 Javascript 执行后加载内容脚本? 的相关文章

随机推荐