如何在构建 HTML 时去除 JavaScript 代码？

Question

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

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

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

HTML 应该是无脚本的，但也有例外，一个代码段在图像标签下具有以下代码：

<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;
});

Answer 2

你可以像这样使用 jquery 轻松地做到这一点：

编辑：

html

<div id="content" style="display:none">
    <!-- dynamic -->
</div>

js

$("#content").append(
    $(html_string).find('img').each(function(){
        $(this).removeAttr("onload");
        console.log($(this).attr("src"));
    })
);