使用 JavaScript 清理 HTML答案

【问题标题】：Cleaning HTML using JavaScript使用 JavaScript 清理 HTML
【发布时间】：2012-01-25 02:55:22
【问题描述】：

在我正在开发的应用程序中，用户在文本框中输入 HTML，以编辑其页面上的元素。在这个阶段，用户可以添加任何类型的内容，甚至是损坏的 HTML 和一些文本节点。

为了确保我得到一些干净的代码，我这样做了

var s = document.createElement('div');
s.innerHTML = content;
// loop over each node in s, and if text node is found, wrap in span.
content = s.innerHTML

这个sn-p的问题在于内容是<TD>Text</TD>，我得到的结果是Text，因为DIV中不能有TD。

在所有情况下是否有解决方法来获取有效内容？

【问题讨论】：

标签： javascript html dom html-parsing

【解决方案1】：

使用 DOM 的问题在于您并不真正想要完全正确的 html，因为您正在添加允许 html 为 sn-p 的条件。您希望纠正一些格式错误的 html，而有些则不需要。

Google 搜索了一下，发现了这个 jQuery 插件：http://www.davidpirek.com/blog/html-beautifier-jquery-plugin

但我不能保证。

我可能会同意 Graham 并建议 HTML Tidy，因为它既成熟又快速，即使您必须等待响应。

【讨论】：

【解决方案2】：

最好的解决方案是将您的 HTML 字符串传递给运行 HTML Tidy 的服务器页面，然后返回“干净”版本。恐怕我不知道有任何强大的、仅限客户端的解决方案。

编辑：一种廉价的解决方案是使用 DOM 本身，或者使用 jQuery 更快：

var input='<div><td>foo</td>';
var output = $('<div>'+html+'</div>').html(); //=> '<div>foo</div>'

这不会清除所有错误，但对您来说可能就足够了。

【讨论】：