如何获得一个内容脚本加载后，页面的JavaScript执行？ [英] How to get a content script to load AFTER a page's Javascript has executed?

问题描述

我的扩展应该只在它注入的页面已经完全加载（是的，我已经在扩展清单中将run_at设置为document_end）后才加载内容脚本searchTopic.js，但事实上它在所有DOM对象被创建之前加载（关键的是通过页面中的一些Javascript创建的）。所以，问题是，我如何等待页面的Javascript执行完毕？这是我的清单：

 content_scripts：[
 {
run_at：document_end， 
匹配：[https://groups.google.com/forum/*]，
js：[searchTopic.js] 
} 
 ]，
  

解决方案

run_at：document_end相当于 DOMContentLoaded 。也就是说，它会在加载静态 HTML之后触发，但在缓慢的图像和缓慢的整理javascript之前触发。

所以你不能设置一个内容脚本在页面的JS之后触发，只需设置清单。您必须在内容脚本本身进行编码。

对于内容脚本，run_at：document_end将在 onload 事件之前触发（不同于默认的 document_idle - 可以在不可预知的时间触发）。因此，第一步是在你的内容脚本中用这样的代码等待 load 事件（ searchTopic.js ）：

  window.addEventListener（load，myMain ，假）; 
 
函数myMain（evt）{
 //在这里做你的东西。 
} 
  

在您关心的脚本需要一段时间才能完成，您将不得不根据具体情况轮询一些情况。例如：

  window.addEventListener（load，myMain，false）; 
 
函数myMain（evt）{
 var jsInitChecktimer = setInterval（checkForJS_Finish，111）; 
 
函数checkForJS_Finish（）{
 if（typeof SOME_GLOBAL_VAR！=undefined
 || document.querySelector（SOME_INDICATOR_NODE_css_SELECTOR）
）{
 clearInterval（jsInitChecktimer）; 
 //在这里做你的东西。 
} 
} 
} 
  

My extension is supposed to load a content script, searchTopic.js, only after the page it's injected into has already fully loaded (yes, I have set "run_at" to "document_end" in the extension manifest), but in fact it's loading before all the DOM objects have been created (the crucial ones are created via some Javascript in the page). So, the question is, how can I wait until the page's Javascript has executed? Here's my manifest:

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

解决方案

"run_at": "document_end" is the equivalent to DOMContentLoaded. That is, it fires after the static HTML is loaded, but before slow images and slow finishing javascript.

So you cannot set a content script to fire after the page's JS, just by setting the manifest alone. You must code for this in the content script itself.

For content scripts, "run_at": "document_end" will fire before the onload event (unlike the default document_idle -- which can fire at unpredictable times).

So, the first step is to wait for the load event with code like this in your content script (searchTopic.js):

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

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

In the case where the script you care about takes a while to finish, you will have to poll for some condition on a case-by-case basis. For example:

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.
        }
    }
}

这篇关于如何获得一个内容脚本加载后，页面的JavaScript执行？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！