javascript - 使用 JavaScript 检查 HTML 片段是否有效

Question

我需要一个可靠的 JavaScript 库/函数来检查我可以从我的代码中调用的 HTML 片段是否有效。例如检查打开的标签和引号是否关闭，嵌套是否正确等。

我不希望验证失败，因为有些东西不是 100% 标准(但无论如何都会起作用)。

Answer 1

更新:这个答案是有限的——请看下面的修改。

扩展@kolink 的回答，我使用:

var checkHTML = function(html) {
  var doc = document.createElement('div');
  doc.innerHTML = html;
  return ( doc.innerHTML === html );
}

即，我们用 HTML 创建一个临时的 div。为了做到这一点，浏览器会根据 HTML 字符串创建一个 DOM 树，这可能涉及关闭标签等。

将 div 的 HTML 内容与原始 HTML 进行比较将告诉我们浏览器是否需要更改任何内容。

checkHTML('<a>hell<b>o</b>')

返回错误。

checkHTML('<a>hell<b>o</b></a>')

返回真。

编辑:正如@Quentin 在下面指出的那样，出于多种原因，这是过于严格:浏览器通常会修复省略的结束标记，即使结束标记对于那个标签。例如:

<p>one para
<p>second para

...被认为是有效的(因为允许 Ps 省略结束标记)但是 checkHTML 将返回 false。浏览器还将规范化标记大小写，并改变空格。在决定使用此方法时，您应该了解这些限制。