动态创建的script标签插入到dom中不执行？

Question

js代码如下,alert方法没执行

let html = '<div>我是评论的内容</div><script>alert(1);<\/script>';
document.getElementById('content').innerHTML=html;

Answer 1

是因为新版浏览器封住了这个历史由来已久的安全问题。了解一下 trusted types

https://w3c.github.io/webapps...
https://caniuse.com/trusted-t...

Answer 2

要模拟XSS攻击效果，应该是使用 document.write来实现；
document.write("<script type='text/javascript'>alert(1)</script>");

使用innerHTML方法默认里面的文本就是string类型的，所以不会执行;

动态在页面上插入js代码的两种方式：

//代码一:
let script = document.createElement('script');
script.type= 'text/javascript';
script.onload = script.onreadystatechange = function() {
    if (!this.readyState || this.readyState === "loaded"
 || this.readyState === "complete" ) {
        callback();
 // Handle memory leak in IE
 script.onload = script.onreadystatechange = null;
 }
};
let scriptSrc='./dist/alert.js';
script.src= scriptSrc;
var head = document.getElementsByTagName('head')[0];
head.appendChild(script);

代码二：

//代码二：
var script = document.createElement("script");
script.type = "text/javascript";
script.text = "alert('hi')";
document.body.appendChild(script);