Question

我把几个JS文件放在我的div的属性中，然后把它们做为＆＃34;追加头＆＃34;

<div id='asyncjs' data-asyncjs='
<script src="/jquery.js"></script>
<script src="/file1.js"></script>
<script src="/file2.js"></script>
<script src="/file3.js"></script>
<script src="/file4.js"></script>
'></div>

<script>
var src = document.getElementById("asyncjs");
var magic = src.getAttribute("data-asyncjs");
$('head').append(magic);
</script>

有效。但使用是否正常？

P.S。我也尝试使用

document.head.appendChild(magic)

代替

$('head').append(magic);

但这是一个错误...为什么？

Answer 1

有效。但使用是否正常？

看起来不太正常，并且在属性中包含<符号无效。如果您需要异步加载脚本，为什么不在实际async标记上使用<script>属性？

<script src="/jquery.js" async="async"></script>
<script src="/file1.js" async="async"></script>
<script src="/file2.js" async="async"></script>
<script src="/file3.js" async="async"></script>
<script src="/file4.js" async="async"></script>

但这是一个错误...为什么？

因为您无法将字符串传递给.appendChild()。它只接受节点。如果您必须使用此方法，则可以创建div，设置其innerHTML，然后将其附加到文档头。

var scriptDiv = document.createElement('div');
scriptDiv.innerHTML = magic;
document.head.appendChild(scriptDiv);

从数据属性异步加载多个JS是正常的吗？

1 个答案: