场景是我有很多 js 文件。根据不同的平台调用不同的文件。
所以我有一个问题,因为我想异步加载文件。但这些文件的执行应该同步完成。目前我正在执行这个函数调用
function loadScriptJs(src) {
Console.log(' Call to file '+src);
var file = document.createElement('script'),
head = document.getElementsByTagName('head')[0];
file.type = 'text/javascript';
file.setAttribute("defer","defer");
file.setAttribute("src",src);
head.appendChild(file);
file.onload = function() {
console.log(src + " is loaded.");
};
}
现在我有一个数组,其中包含被调用的 js 文件列表。我循环遍历数组并为每个 src 调用此函数。
我在每个 js 文件中使用了 document.ready 函数。这里我检查了文件的依赖关系并对顺序进行了优化。即依赖文件稍后加载(在数组中稍后加载),并且更多类似父文件的文件更早加载。
示例:- 如果我有文件 A1、B2、C3、D4、E5 ..... 同样。我的数组是 ['js/A1.js','js/B2.js','js/C3.js'...]。当我通过循环运行这个时。
我得到“调用文件[文件名]”的控制台与数组中的顺序相同,但“[文件名]已加载”的控制台未按预期顺序出现。
是的,我无法控制加载,因为它是通过互联网进行的。但我希望执行是同步的。即当最后一个文件完成加载时开始所有文件执行。
任何人都可以给我任何意见、建议或想法吗?
动态插入的脚本可能不遵守defer
属性。script
标签有一个async
属性。默认情况下这是真的。明确将其设置为 false。
file.setAttribute("async", "false");
或纯 HTML 格式
<script type="text/javascript" async=false src="A1.js"></script>
您可能还需要删除document.ready
方法在每个脚本中,并在顶层启动脚本的逻辑,将每个 JS 脚本附加到底部body
标签而不是标题。如果多个脚本在触发之前注册了就绪事件,您将不知道它们将以什么顺序调用。
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)