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，因此您可以等待DOM load元素上的<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") }
)

通过内容描述检查网页中是否存在变量

1 个答案: