google-chrome - 通过内容脚本检查网页中是否存在变量

Question

我想有条件地在网页的 DOM 中插入一些 javascript 文件。我还想添加一个依赖项。

var load = function(filename, callback) {
   fileref  = document.createElement("script")
   fileref.setAttribute "type", "text/javascript"
   fileref.setAttribute "src", filename
   document.getElementsByTagName("head")[0].appendChild fileref
   if (typeof callback !== "undefined" && callback !== null) {
     callback();
   }
}

load("http://www.myserver.com/lib.js",
  function() { load("http://www.myserver.com/core.js") }
)

但我想检查“lib.js”是否实际执行。为此，我想等到 lib.js 中的变量可用。我该怎么做？

Answer 1

不要callback立即运行。因为内容脚本与其页面共享 DOM，所以您可以等待loadDOM<script>元素上的事件：

var load = function(filename, callback) {
   fileref  = document.createElement("script");
   fileref.setAttribute("type", "text/javascript");
   fileref.setAttribute("src", filename);

   // fire callback when script loads
   fileref.addEventListener("load", function() {
       if (typeof callback !== "undefined" && callback !== null) {
         callback();
       }
   });

   document.getElementsByTagName("head")[0].appendChild(fileref);
}

load("http://www.myserver.com/lib.js",
  // this callback will run only after lib.js has fully loaded
  function() { load("http://www.myserver.com/core.js") }
)