Question

我想在我的页面上有以下内容：

一个脚本（“script1.js”），它向页面动态添加第二个脚本（“script2.js”）。
第三个脚本（“script3.js”）。

“script3”会覆盖“script2”中的一些函数，因此脚本应该被解析的顺序是：

script1＆gt; script2＆gt; script3。

控制台应显示：1 2 3.相反，我看到1 3 2。

我尝试在“script3”上使用“defer”但没有成功：

HTML文件：

<html>
<head>
    <script src="script1.js"></script>
    <script defer type='text/javascript' src="script3.js"></script>
</head>
</html>

script1.js：

console.log('1');
var head = document.getElementsByTagName('head')[0];
const url = 'script2.js';
var script = document.createElement('script');
script.type = 'text/javascript';
script.src = url;
head.appendChild(script);

script2.js：

console.log('2');

script3.js：

console.log('3');

Answer 1

听起来很丑陋，您可以使用document.write内的script1.js来加载script2.js。脚本将以正确的顺序执行。

// script1.js
console.log('1');
document.write('<script src="script2.js"></script>');

JS：在其他脚本之前解析动态添加的脚本

1 个答案: