动态将JS代码添加到head标签

Question

我正在尝试将脚本添加到页面的head标签。 我正在尝试在body标签中添加代码，但未在head标签中显示。

$(document).load(function() {
   $('<script>console.log("hi");</' + 'script>').appendTo("head")
});

我看到这是在<body>中添加的，但是我没有在<head>看到它。

我尝试了append，appendTo和document.ready和document.load函数的变体。 到目前为止，这些都不起作用。

在发布之前，我经历了类似线程的讨论。 我似乎没有解决我的问题

Answer 1

您可能需要做的一件事是将</换成<\\/

如果它是一个内联脚本，也许您可以尝试向其添加setTimeout。

Answer 2

尝试以下功能：

(function (src) {
    var tagName = 'script', script = document.createElement(tagName);
    script.src = src;
    var elm = document.getElementsByTagName(tagName)[0];
    elm.parentNode.insertBefore(script, elm);
})('SCRIPT.SRC.HERE.js');

这将创建一个动态script标签，并将其添加到第一个script标签之前。 如果如果head没有任何script标签，它将无法以您希望的方式工作。 在这种情况下，您可以使用以下功能：

(function (src) {
    var tagName = 'script', script = document.createElement(tagName);
    script.src = src;
    var head = document.getElementsByTagName('head')[0];
    head.insertBefore(script, head.childNodes[0]);
})('SCRIPT.SRC.HERE.js');

这将直接获取head标记内的第一个元素，并在其之前附加新脚本。

Answer 3

该document不会触发“加载”事件-否则，它是来自其他加载对象（例如另一个脚本或图像文件）的冒泡事件。 尝试将document更改为window ：

http://jsfiddle.net/5bhmwyrx/3/

$(window).load(function() {
   var script = $('<script>console.log("hi");</' + 'script>').appendTo(document.head);
   console.log("Script was appended to", script[0].parentNode.nodeName);
   //-> Script was appended to HEAD
});

$(document).load(function() {
   console.log("You should never see this");
});

document.onload = function () {
    console.log("You should not see this in modern browsers");
};

动态将JS代码添加到head标签

问题描述

3 个解决方案

解决方案1
0

解决方案2
0 2015-10-06 18:31:07

解决方案3
0 2015-10-06 18:46:16

动态将JS代码添加到head标签

问题描述

3 个解决方案

解决方案1 0

解决方案2 0 2015-10-06 18:31:07

解决方案3 0 2015-10-06 18:46:16

解决方案1
0

解决方案2
0 2015-10-06 18:31:07

解决方案3
0 2015-10-06 18:46:16