javascript - 如何在构建 HTML 时剥离 JavaScript 代码？

Question

我正在尝试解析一些 HTML 以在其中查找图像。

例如，我创建了一个动态的 div 并像这样解析标签:

var tmpDiv = document.createElement("DIV");
tmpDiv.innerHTML = html;

HTML 应该是无脚本的，但也有异常(exception)，一个代码段在图像标签下有以下代码:

<img src=\"path" onload=\"NcodeImageResizer.createOn(this);\" /> 

通过创建一个临时 div，“onload”函数会调用自身并产生 JavaScript 错误。

有没有办法告诉浏览器在构建 HTML 元素时忽略 JavaScript 代码？

编辑:
我忘了提一下，稍后我想在文档的 div 中显示此 HTML，因此我正在寻找一种方法来忽略脚本而不使用字符串操作。

谢谢!

Answer 1

这样做的一种方法是遍历 div 的子项并删除您想要的事件处理程序。

考虑以下几点:

我们有一个包含一些 HTML 的变量，它又内嵌了一个 onload 事件处理程序:

var html = "<img src=\"http://www.puppiesden.com/pics/1/doberman-puppy5.jpg\" 
alt=\"\" onload=\"alert('hello')\" />"

我们创建一个容器来放入这个 HTML，我们可以遍历子项并删除相关的事件处理程序:

var newDiv = document.createElement("div");
$(newDiv).html(html);
$(newDiv).children().each(function(){this.onload = null});

这是一个工作示例:http://jsfiddle.net/XWrP3/

更新

OP 询问是否同时删除其他事件。据我所知，没有办法以自动方式删除所有事件，但是您可以根据需要简单地将每个事件设置为 null:

$(newDiv).children().each(function(){
    this.onload = null;
    this.onchange = null;
    this.onclick = null;
});