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的变量，而这个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"));
    })
);

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

2 个答案: