如何在 javascript append 中执行 <script> 代码
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/14269587/
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
How to execute <script> code in a javascript append
提问by user734063
I'm working with a plugin that is only Javascript. I need to have it dynamically create a DIV element with an advertisement in it.
我正在使用一个只有 Javascript 的插件。我需要让它动态创建一个带有广告的 DIV 元素。
I can't figure out why this doesn't work:
我不明白为什么这不起作用：
$(this).append('<div class="overlay-background">Advertisement
<script type="text-javascript">
GA_googleFillSlot("blog_landing_right_rectangle_300x250");
</script>'
It results in the element created with "Hello World" but it does not execute the GA-googleFillSlot function.
它会生成使用“Hello World”创建的元素，但不会执行 GA-googleFillSlot 函数。
回答by wless1
appending HTML into the DOM does not cause the browser to evaluate any script tags in said appended HTML.
将 HTML 附加到 DOM 中不会导致浏览器评估所述附加 HTML 中的任何脚本标签。
If you really wanted to, you could evaluate the javascript by using eval():
如果你真的想，你可以使用eval()以下方法评估 javascript ：
eval($(this).find("script").text());
回答by Azder
This code works in my browser.
此代码适用于我的浏览器。
$('body').append('<script>alert("test");<' + '/' + 'script>');
so it might be that $(this)is what is actually causing your problem.
所以这可能$(this)是真正导致您问题的原因。
Can you replace it with 'body'and see if it works like that?
你能用它代替它，'body'看看它是否像那样工作？
回答by temo
I know this is an old question but I've had a similar problem today. The solution was using createContextualFragment.
我知道这是一个老问题，但我今天遇到了类似的问题。解决方案是使用createContextualFragment。
My code looks something like this:
我的代码看起来像这样：
var tagString = '<script async type="text/javascript" src="path_to_script"></script>';
var range = document.createRange();
range.selectNode(document.getElementsByTagName("BODY")[0]);
var documentFragment = range.createContextualFragment(tagString);
document.body.appendChild(documentFragment);
回答by Christophe
One workaround in your case could be to append a fake image with an onload event:
在您的情况下，一种解决方法可能是使用 onload 事件附加假图像：
<img src="blank.gif" onload="GA_googleFillSlot('blog_landing_right_rectangle_300x250')" />
回答by Vladimir Kolesnikov
Please try:
请尝试：
s = '<' + 'script type="text-javascript">' +
'GA_googleFillSlot("blog_landing_right_rectangle_300x250");' +
'<' + '/' + 'script>';
$(this).append(s);
UPD: alas, this won't work, please use wless1's solution instead
UPD：唉，这行不通，请改用 wless1 的解决方案
回答by memical
since your are in javascript, you can append and then execute the code:
由于您在 javascript 中，您可以附加然后执行代码：
$(this).append('<div class="overlay-background">Advertisement</div>');
GA_googleFillSlot("blog_landing_right_rectangle_300x250");
