javascript 动态添加的脚本不会执行
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/7761149/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Dynamically added script will not execute
提问by guanome
I am dynamically adding a script of a github gist. If I added it to the html before the page loads, the script will execute. But If I try to add it to the page after it loads it adds the script to the page but doesn't execute it.
我正在动态添加 github gist 的脚本。如果我在页面加载之前将它添加到 html，脚本将执行。但是如果我在加载后尝试将它添加到页面，它会将脚本添加到页面但不执行它。
Here is how I am adding it to the page
这是我将它添加到页面的方式
Html
html
<div id="results"></div>
Javascript
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');
});
Here is the live example
这是现场示例
采纳答案by LoveAndCoding
So, the best option I can see is to override (even if just temporarily while the script loads) document.write. It is sort of a work around, but since you don't control the code coming in, I think it may be the best you've got. You also shouldn't be using document.writeanytime after the page loads, but just in case, I'd maybe comb through your code.
所以，我能看到的最好的选择是覆盖（即使只是在脚本加载时暂时）document.write。这是一种解决方法，但由于您无法控制进入的代码，我认为它可能是您拥有的最好的。您也不应该document.write在页面加载后随时使用，但以防万一，我可能会梳理一下您的代码。
Here's a fiddlewith a working solution. If you wanted to revert document.writeafter the script loaded, you can always check to see if script.completeis true, otherwise, listen for an onloadevent, which should allow you to change document.writeback. I'm too lazy to code it into the fiddle at the moment, but this would be the code generally:
这是一个工作解决方案的小提琴。如果您想document.write在脚本加载后恢复，您可以随时检查是否script.complete为 is 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);
});
回答by Eli Grey
It's executing, but it won't work since it uses document.write, which can only be used synchronously. Include async document.write, and modify your script as such:
它正在执行，但它不会工作，因为它使用document.write，只能同步使用。包括asyncdocument.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');
});
回答by xtools
I was able to accomplish this after hours of trying, including all other answers here. My script tag looks like this:
经过数小时的尝试，我能够完成此操作，包括此处的所有其他答案。我的脚本标签如下所示：
<script src="https://somedomain.com/some.js"></scipt>
so no eval() was possible.
所以没有 eval() 是可能的。
I've used jQuery.getScript() in the end, which fetches the js file and executes it:
我最后使用了 jQuery.getScript()，它获取 js 文件并执行它：
var $scriptTag = $('#myElement script');
var scriptSrc = $scriptTag.attr('src');
$.getScript(scriptSrc);
回答by LoveAndCoding
So, as an alternative, I actually just stumbled upon a library which seems like it would handle this for you. Check out Injector.js, and it should work for you.
因此，作为替代方案，我实际上只是偶然发现了一个似乎可以为您处理此问题的库。查看Injector.js，它应该适合你。
回答by Kunal Kinalekar
your script is executing , you just can't use document.write from it. Use an alert to test it and avoid using document.write. The statements of your js file with document.write will not be executed and the rest of the function will be executed.
你的脚本正在执行，你只是不能使用它的 document.write 。使用警报来测试它并避免使用 document.write。带有 document.write 的 js 文件的语句将不会被执行，而函数的其余部分将被执行。
回答by razvancod
Try $(this).append(script) or $(this).html(script)
试试 $(this).append(script) 或 $(this).html(script)
