用于查找未封闭的 HTML 标记的 JavaScript 库/函数

Question

我目前正在寻找一种解决方案，以从任意原始 HTML 片段中查找并列出所有未闭合的 HTML 标记。我不觉得这应该是一个可怕的问题，但我似乎无法在 JS 中找到可以做到这一点的东西。不幸的是，这需要在客户端进行，因为它用于向 HTML 页面呈现注释。显然，注释有点麻烦，因为它们选择或应用的格式可能仅适用于 HTML 元素的一部分(即，覆盖在现有 HTML 标记上的标记)。

一个简单的用例是您可能只想呈现 HTML 页面的一部分，然后再注入(inject)其余部分。例如，假设一个分割市场:

<p>This is my text <StartDelayedInject/> with a comment I added. </p>
<p> But it doesn't exist until now. </p> <StopDelayedInject/>

我将进行一些预处理以重建 HTML，以便将部分元素包装到应用适当格式的 span 类型元素中。最初这将以以下形式解析:

<p><span>This is my text</span></p>

经过一些用户操作后，它会被修改为如下形式:

<p><span>This is my text</span><span>with a comment I added.</span></p>
<p>But it doesn't exist until now.</p>

这是一个非常简化的示例案例(显然 ul 元素和表之类的东西变得更加复杂)，但给出了一般原则。然而，为了有效地做到这一点，我需要能够检查一段 HTML 并找出已经打开(但未关闭)的标签。如果我知道该信息，我可以将最后一个未终止的文本数据包装到一个跨度中，关闭未关闭的标签，并知道返回到该点以在需要时注入(inject)剩余的内容。但是，我需要知道仍然打开的标签，这样当我注入(inject)或修改另一段内容时，我可以确保将它放在正确的位置(例如，在第一段)。

根据我对上下文无关文法的理解，这应该是一个相对微不足道的任务。每次打开/输入或关闭/退出标签时，您可以只保留一堆打开但尚未关闭的标签。话虽如此，我宁愿使用一个更成熟的解决方案库，也不愿为此目的制作朴素的解析器。我假设周围有一些 JS HTML 解析器可以做到这一点，对吧？他们中的很多人都知道如何关闭标签，所以在某些时候他们很清楚地计算出了这一点。

Answer 1

问题是 JavaScript 只能通过两种方式访问​​ html:

1. 从某种意义上说，每个元素都是一个对象，具有浏览器在页面加载时创建的属性和方法。
2. 从某种意义上说，它是一串文本。

使用第一种与 html 接口(interface)的方法，无法检测未关闭的标签，因为您只能访问浏览器在解析 html 后为您创建的对象。

使用第二种方法，您必须通过 html 解析器运行整个 html 字符串。有些人可能认为您可以简单地使用正则表达式来完成，但是，这是不可行的。我把你推荐给这个很棒的 stackoverflow question .

即使您找到了一个非常强大的 html 解析器来使用，您仍然会遇到这样一个事实所造成的问题，即在您的 JavaScript 接触它之前，浏览器将尝试解析可能损坏的 html，并且可能到处都是错误。

编辑:

如果您喜欢解析器的想法，John Resig 创建了 this example one您可能需要引用。