<div>aaa<script type="text//javascript">alert('test');</script></div>
这样的一段HTML节点中包含了一些JS代码.如果想把这段放到一个DOM容器中.并且把里面的JS运行起来
这样问题就出现了.
首先:
$('fun').innerHTML = '<div>aaa<script type="text//javascript">alert(/'test/');</script><//div>';
这样写的话就有问题了.里面的JS是无法运行起来的
在做 ajax 编程时，我们常常需要将 xmlhttp 获取到的页面内容通过 innerHTML 来赋给某个容器（比如 div、span 或者 td 等），但是这里存在一个问题，就是我们将要赋给 innerHTML 的页面内容如果包含有脚本程序，这些脚本程序不管是外部脚本，还是内部脚本，可能(1)都不会被执行。这个问题在某些时候微不足道，甚至可以忽略，但有些时候，这个问题就非常严重，它很可能让我们的程序得不到预期的结果。因此我们需要解决这个问题。
如果你读过 MSDN，你会发现并非所有插入到 innerHTML 中的脚本都不能执行，如果这段脚本的 script 标签中包含了 defer 属性，IE 会正确的执行这些脚本程序。但不幸的是，Moziila/Firefox 和 Opera 可不吃这一套，不管 script 标签有没有设置 defer 属性，这些浏览器都不会向 IE 那样去执行插入到 innerHTML 中的脚本。
但不管脚本是否被执行了，有一点我们可以肯定，那就是这些脚本确实被插入到了 innerHTML 中，如果不相信，你可以 alert 一下看看。但如果你真的 alert 了，你也可能会发现有一种例外情况存在，那就是如果脚本在 innerHTML 内容开头的话，那么 IE 浏览器将会忽略掉这段脚本，而 Moziila/Firefox 和 Opera 却不会。
下面给出一个简单的解决方法
var $ = function(o){
return document.getElementById(o);
};
var fillHTML = function(el, HTMLString){
if (!el)
return;
if (!+"/v1") {
el.innerHTML = "<img style='display:none'/>" + HTMLString.replace(/<script([^>]*)>/ig, '<script$1 defer>');
el.removeChild(el.firstChild)
}
else {
var nSibling = el.nextSibling;
var pNode = el.parentNode;
pNode.removeChild(el);
el.innerHTML = HTMLString;
pNode.insertBefore(el, nSibling)
}
}
function T(){
fillHTML($('fun'), '<div>aaa<script type="text//javascript">alert(/'test/');<//script><//div>');
}
ps:这个方法只能运行本地脚本，如果运行跨域脚本就不适用了
例如 fillHTML($('channelname'), '<script type="text//javascript" src=2.js><//script>');可以运行
如果换为 fillHTML($('channelname'), '<script type="text//javascript" src=http://www.domain.com/2.js><//script>');
就无法显示