使用 document.head.appendChild() 附加具有 SRC 属性的脚本标签？答案

【问题标题】：Using document.head.appendChild() to append a script tag that has an SRC attribute?使用 document.head.appendChild() 附加具有 SRC 属性的脚本标签？
【发布时间】：2014-03-05 23:24:15
【问题描述】：

以下代码不起作用的任何原因？

alert("1");
document.head.appendChild("<script type=\"text/javascript\" src=\"https://getfirebug.com/firebug-lite.js\"></script>");
alert("2");

（我知道它正在中断，因为 1 已发出警报，但 2 未发出警报。）

完成同一件事的正确方法是什么？即，将脚本标签附加到文档头部，该标签使用 SRC 属性获取 .js 文件。我不希望它内联编写 javascript。

谢谢！

【问题讨论】：

您在开发控制台中看到了哪些错误？
How to add DOM element script to head section?的可能重复

标签： javascript

【解决方案1】：

element.appendChild 需要一个节点而不是字符串。您应该首先创建节点并设置属性，然后附加它。

element.appendChild Reference

var sc = document.createElement("script");
sc.setAttribute("src", "https://getfirebug.com/firebug-lite.js");
sc.setAttribute("type", "text/javascript");
document.head.appendChild(sc);

对于不支持document.head的旧版浏览器（IE

document.getElementsByTagName("head")[0].appendChild(sc);

【讨论】：

【解决方案2】：

这将在不创建新对象的情况下完成原始发布者想要的操作。

document.head.innerHTML += "<script type=\"text/javascript\" src=\"https://getfirebug.com/firebug-lite.js\"></script>";

脚本将附加到现有头部部分的末尾，这可能不是您想要的。

信不信由你，这会将您的脚本放在 head 部分的开头，而不会删除现有的 head 部分：

document.head.innerHTML = "<script type=\"text/javascript\" src=\"https://getfirebug.com/firebug-lite.js\"></script>" + document.head.innerHTML;

【讨论】：