Question

document.body.innerHTML = "<script>alert(11);</script>"

$("body").html("<script>alert(11);</script>")

innerHTML未执行。

执行jQuery html()。

为什么会这样？

Answer 1

没有深入理解为什么jQuery选择这样做的理论问题，jQuery html()的行为与本地innerHTML的行为不同。默认情况下，jQuery将在HTML中找到脚本标记，然后异步加载。如果不希望出现这种情况，可以使用$.parseHTML通过将第三个参数设置为false来防止这种情况发生。

$("body").empty().append($.parseHTML("<script>alert(11);</script>", document, false));

请注意，使用此方法不会将脚本标记添加到DOM中。

相反，如果您希望在vanilla JS中获得与jQuery语句相同的效果，则可以执行以下操作。

var script = document.createElement('script');
script.text = 'alert(11);';
document.body.innerHTML = '';
document.body.appendChild(script);

Answer 2

试试这个......

var x = document.createElement('script');
var y = document.getElementsByTagName('script')[0];
x.text = "alert(11);"
y.parentNode.insertBefore(x, y);

Answer 3

使用innerHTML将根据文档以简单的单词停止执行脚本，而无需详细说明。

<script type="text/javascript">
    var script = document.createElement('script');
    script.appendChild(document.createTextNode("alert('11')"));
    document.body.appendChild(script);
</script>

脚本执行 - innerHTML，jQuery html（）

3 个答案: