获取 HTML 注释标签内的文本？答案

【问题标题】：Get text inside HTML comment tag?获取 HTML 注释标签内的文本？
【发布时间】：2013-05-25 19:57:44
【问题描述】：

我有以下 HTML：

<!--
<option value="HVAC">HVAC</option>
<option value="Cooling">|---Cooling</option>
<option value="Heating">|---Heating</option>
-->
....

我使用 jQuery 的 get 方法动态获取此文件并将其存储在一个名为 load_types 的字符串变量中。

如何去除 HTML 注释标签以及它们之外的所有内容？我只想要里面的 HTML：

<option value="HVAC">HVAC</option>
<option value="Cooling">|---Cooling</option>
<option value="Heating">|---Heating</option>

我尝试使用 the solutions here，但没有任何效果 - 我只是将 null 作为匹配项。

感谢您的帮助！

【问题讨论】：

我试过 load_types.match(//g);无济于事——只是得到了空值。
阅读此*.com/questions/5653207/…
能否请您在jsfiddle.net中提供样品

标签： javascript jquery

【解决方案1】：

请never use regex to parse HTML。您可以改用以下内容：

var div = $("<div>").html(load_types),
    comment = div.contents().filter(function() {
        return this.nodeType === 8;
    }).get(0);

console.log(comment.nodeValue);

演示： http://jsfiddle.net/HHtW7/

【讨论】：

原生 JavaScript 解决方案：jsfiddle.net/4g3FT，原生 JS 解决方案假设 ES5 jsfiddle.net/TUR65
@MatíasFidemraizer 我真的需要发布一个非常复杂的反例吗，或者像 world";</script> ---> 这样的微不足道的东西足以让你相信正则表达式是处理这类事情的坏工具？跨度>
@MatíasFidemraizer 那东西可能是正常的，但找到它的上下文肯定不是
您将进入边缘案例。 OP情况很规律，非常非常非常非常规律。 OP 案例不是“我想解析任何 HTML”，而只是示例代码中显示的 HTML。这是常规的吗？这是非常规律的！我知道您不会使用正则表达式创建完整的 HTML 解析器，但正则表达式对于整个案例来说就足够了。
@MatíasFidemraizer 正则表达式是从评论中提取字符串的极差选择，如果 OP 的字符串发生变化，即使您之前建议的正则表达式最轻微也会中断。虽然在 OP 中匹配字符串中的注释肯定是常规的（想象一下自动机），但实际上这是一个非常糟糕的主意，特别是因为这种能力已经内置到浏览器和任何了解 DOM 的稍微胜任的 JS 代码中101 可以毫不费力地做到这一点。

【解决方案2】：

您可以简单地获取评论所在的父标记的 html 并执行 .replace("", "")，这将简单地删除评论标记，然后将此标记附加到其他父标记或替换您当前的标记或创建一个新的父标记它并附加它。

这将允许您使用 jQuery 选择器来检索所需的数据。

var comment = '<!-- <option value="HVAC">HVAC</option> <option value="Cooling">|---Cooling</option> <option value="Heating">|---Heating</option> --> ';

jQuery("#juni").append("<select>"+comment.replace("<!--", "").replace("-->", "") + "</select>")

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<div id="juni"></div>

【讨论】：