Javascript onload事件-如何判断脚本是否已加载?

Javascript onload事件-如何判断脚本是否已加载?,javascript,dynamic,onload,Javascript,Dynamic,Onload,如何使用javascript确定HtmlScript元素是否已完全加载 如何确定动态加载的脚本是否已在不使用onload或onreadystate更改事件的情况下完成加载 代码如下: TOOL.loadScript = function (url, callback, reappend, deepSearch) { var head, curr, child, tempScript, alreadyAppended, queue, alreadyHandled,

如何使用javascript确定HtmlScript元素是否已完全加载

如何确定动态加载的脚本是否已在不使用onload或onreadystate更改事件的情况下完成加载

代码如下:

   TOOL.loadScript = function (url, callback, reappend, deepSearch) {
      var head, curr, child, tempScript, alreadyAppended, queue, 
      alreadyHandled, script, handler, loadFunc; 

      head = document.getElementsByTagName("head")[0];
      tempScript = document.createElement("script");
      tempScript.src = url;
      alreadyAppended = false;

      queue = []; 

      if (deepSearch) {
         // search entire document
         queue.push(document.firstElementChild);
      }
      else { 
         // just search the head element
         queue.push(head); 
      }

      while (queue.length !== 0) { 
         curr = queue.shift();

         // add child nodes to queue
         child = curr.firstElementChild; 
         if (child !== null && child !== undefined) { 
            queue.push(child);
            child = child.nextElementSibling;
            while (child !== null && child !== undefined) { 
               queue.push(child);
               child = child.nextElementSibling;
            } 
         }

         if (curr.tagName !== null && curr.tagName !== undefined) {
            if (curr.tagName.toLowerCase() === "script" && curr.src === tempScript.src) {
               script = curr;
               alreadyAppended = true;
               break;
            }
         }
      }

      if (!alreadyAppended) { 
         script = document.createElement("script");
         script.type = "text/javascript"; 
         script.async = true; 
         script.src = url; 
      } 

      alreadyHandled = false; 

      handler = function (event) {
         console.log("handling event..."); 
         if (!alreadyHandled) { 
            if ((!event.readyState) || (event && (event.readyState === "loaded" || event.readyState === "complete"))) {  
               alreadyHandled = true; 
               callback.apply(script, [url]);
               if (loadFunc) { 
                  loadFunc.apply(script, arguments); 
               }
            }
         }
      }; 

      if (script.onreadystatechange === undefined) { 
         loadFunc = script.onload;
         script.onload = handler; 
      } 
      else { 
         loadFunc = script.onreadystatechange; 
         script.onreadystatechange = handler; 
      } 
我需要帮助。我希望即使
alreadyAppeneded===true
并且已经加载了相同的脚本,但只有在该脚本完全加载完毕时,回调函数才会启动

      if (!alreadyAppended || (alreadyAppended && reappend)) { 
         head.appendChild(script); 
      } 
   };
底线:如何确定脚本是否已完成加载?如果需要,请问我问题


多谢各位

惰性实现:创建一个数组,您可以使用该数组将所有加载脚本的源推送到列表中,并在加载时将其推送到列表中。每次检查给定的src是否在数组中,如果在数组中,则立即启动回调

当案例附加但未加载时,您如何处理该案例成为问题。如果希望启动回调,但希望它在加载后启动,则可以使用src作为键,script元素作为值来创建关联数组。从那里,通过包装原稿,使onload或onreadystatechange fire两次,如下所示:

var temponload = element.onreadystatechange || element.onload;
if (element.onreadystatechange === undefined)
    element.onload = function(e) { temponload(); temponload(); };
else
    element.onreadystatechange = function (e) { temponload(); temponload(); };

您可能需要将其他代码与此挂钩,但这应该会让您满怀希望地开始使用。

您无法真正判断脚本何时加载。您可以将全局变量放入要检查的脚本中,然后测试它是否存在


有一个名为LABjs(Loading and Blocking Javascript)的新项目,用于动态加载脚本,从而告知实际加载的时间(http://blog.getify.com/2009/11/labjs-new-hotness-for-script-loading/ 为什么不在脚本元素中添加一个id?继续之前,请检查该id是否存在

function includeJs(jsFilePath) {

  if (document.getElementById(jsFilePath+"_script")) {
    return;
  }
  var js = document.createElement("script");

  js.type = "text/javascript";
  js.id = jsFilePath+"_script";
  js.src = jsFilePath;

  document.body.appendChild(js); 
}

注意*这并不验证是否实际加载了任何内容,只是验证了元素是否已创建。老兄…非常感谢您提醒我这种可能性。我正在尝试解决在同一页面上插入重复脚本的问题,现在它已修复。如果我在6小时前看到这一点就好了。:DY如果设置脚本中的变量