在做 ajax 编程时,我们常常需要将 xmlhttp 获取到的页面内容通过 innerHTML 来赋给某个容器(比如 div、span 或者 td 等),但是这里存在一个问题,就是我们将要赋给 innerHTML 的页面内容如果包含有脚本程序,这些脚本程序不管是外部脚本,还是内部脚本,可能都不会被执行。这个问题在某些时候微不足道,甚至可以忽略,但有些时候,这个问题就非常严重,它很可能让我们的程序得不到预期的结果。因此我们需要解决这个问题。
—— 一位济南大学的教师andot今天在他的blog上发布了一篇文章提出了他的解决办法。让我们支持这样的原创作品。
事实上,prototype(v1.4.x)在 "Ajax.Updater" 类中也提供了类似思路的实现,不过代码更为简洁精妙:
update: function(element, html) {
$(element).innerHTML = html.stripScripts();
setTimeout(function() {html.evalScripts()}, 10);
}
......
evalScripts: function() {
return this.extractScripts().map(eval);
}
这两个函数很清楚的说明了执行innerHTML中的脚本的处理逻辑。