Javascript事件--如何判断脚本是否已经加载？
如何使用javascript来确定HTMLScriptElement是否已经完全加载？
如何确定动态加载的脚本是否使用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);
}
};底线：如何确定脚本是否已经完成加载？如果需要的话请问我一些问题。
谢谢。
回答 3
Stack Overflow用户
发布于 2011-08-11 20:37:06
为什么不向脚本元素添加一个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);
}Stack Overflow用户
发布于 2011-01-04 15:33:55
延迟实现：创建一个数组，您可以使用该数组将所有加载脚本的源推送到上面，并在加载时将它们推送到列表中。每次，检查给定的src是否在数组中，如果是，立即启动回调。
当它被附加但没有加载时，您如何处理它就成了一个问题。如果希望触发回调，但希望它在加载后触发，则可以使用src作为键，脚本元素作为值执行关联数组。从这里开始，通过包装原始的东西，使onload或onreadystatechange燃烧两次，如下所示：
var temponload = element.onreadystatechange || element.onload;
if (element.onreadystatechange === undefined)
element.onload = function(e) { temponload(); temponload(); };
else
element.onreadystatechange = function (e) { temponload(); temponload(); };您可能需要连接其他代码，但这将使您有希望开始工作。
Stack Overflow用户
发布于 2011-01-06 19:20:05
您无法真正判断脚本何时加载。您可以在要检查的脚本中放置一个全局变量，然后测试其是否存在。
有一个名为LABjs (加载和阻塞Javascript)的新项目，用于动态加载脚本，从而判断脚本何时实际加载(http://blog.getify.com/2009/11/labjs-new-hotness-for-script-loading/ <-请检查)
https://stackoverflow.com/questions/4595055
复制相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号