如何使用innerHTML向div中插入js脚本

标签: javascriptinnerHTML   时间:2017-10-24
最近尝试使用innerHTML将一段js代码插入到div中,似乎已经插入成功,但是div里面的js脚本代码不能执行,有没有好的办法能是这个插入的js代码执行呢?

示例代码:

<!DOCTYPE html>
<html>
  <body onload="document.getElementById('loader').innerHTML = '<script>alert(\'hi\')<\/script>'">
    Shouldn't an alert saying 'hi' appear?
    <div id="loader"></div>
  </body>
</html>

 运行结果如下:

Shouldn't an alert saying 'hi' appear?

怎么回事? 为什么被插入的js脚本不执行呢?

正确的做法是创建脚本,然后注入内容。

var g = document.createElement('script');
var s = document.getElementsByTagName('script')[0];
g.text = "alert(\"hi\");"
s.parentNode.insertBefore(g, s);

原文地址:http://www.manongjc.com/article/2181.html