Question

我正在动态添加github gist的脚本。如果我在页面加载之前将其添加到html，脚本将执行。但是如果我在加载后尝试将其添加到页面中，则将脚本添加到页面但不执行它。

以下是我如何将其添加到页面

HTML

<div id="results"></div>

的Javascript

$('#results').click(function() {
    var script = document.createElement("script");
    script.type = "text/javascript";
    script.src = "https://gist.github.com/1265374.js?file=GetGists.js";
    document.getElementById('results').appendChild(script);
    console.log('script added');
});

这是实例

http://jsfiddle.net/guanome/JqB3g/3/

Answer 1

因此，我能看到的最佳选择是覆盖（即使只是在脚本加载时暂时）document.write。这是一种解决方法，但由于你不控制进入的代码，我认为它可能是你得到的最好的。您也不应该在页面加载后随时使用document.write，但为了以防万一，我可能会梳理您的代码。

这是一个有fiddle的工作解决方案。如果您想在加载脚本后还原document.write，则可以随时查看script.complete是否为true，否则，请监听onload事件，该事件应该允许您改回document.write。我现在懒得将它编码到小提琴中，但这通常是代码：

script.src = "...";
document.getElementById("results").appendChild(script);
if(script.complete) document.write = document._write;
else script.load(function() { 
    // Goes to the end of the run queue so that the script 
    // is guaranteed to run before this code
    setTimeout(function(){document.write = document._write;},0);
});

Answer 2

它正在执行，但它不起作用，因为它使用document.write，它只能同步使用。包括async document.write，并修改您的脚本：

$('#results').click(function() {
    var script = document.createElement("script");
    script.type = "text/javascript";
    script.src = "https://gist.github.com/1265374.js?file=GetGists.js";
    document.write.to = {filename: script.src};
    document.getElementById('results').appendChild(script);
    console.log('script added');
});

Answer 3

所以，作为替代方案，我实际上只是偶然发现了一个看起来像它会为你处理这个问题的库。查看Injector.js，它应该适合您。

Answer 4

你的脚本正在执行，你只是不能使用它的document.write。使用警报对其进行测试，避免使用document.write。使用document.write的js文件的语句将不会被执行，其余的函数将被执行。

Answer 5

经过几个小时的努力，我能够完成这项工作，其中包括所有其他答案。我的脚本标记如下所示：

<script src="https://somedomain.com/some.js"></scipt>

所以没有eval（）是可能的。

我最后使用了jQuery.getScript（），它获取js文件并执行它：

var $scriptTag = $('#myElement script');
var scriptSrc = $scriptTag.attr('src');
$.getScript(scriptSrc);

Answer 6

尝试$（this）.append（script）或$（this）.html（script）

动态添加的脚本将不会执行

6 个答案: