如果没有唯一标识属性但有HTML注释，如何用jQuery选择HTML？

Question

我正在为我经常访问的论坛编写自定义脚本。 它设计用于在我查看时从板上删除签名，因为它们分散注意力并且令人讨厌，并且它们无法在选项中禁用它们。

无论如何，我可以使用有用的Chrome扩展程序运行自定义脚本。 我能够修改页面的任何部分，其中HTML节点具有类，ID，甚至具有一些独特信息的属性，但我似乎无法弄清楚如何使用jQuery选择和删除以下HTML。

    <tr>
      <td colspan="2">
        <!--Signature-->
            <div class="resultText">
                <!-- sig -->
                    <div>Signature text</div>
                <!-- / sig -->

            </div>
      </td>
    </tr>

如果有一种方法我可以抓住<!--Signature-->的父母那将是完美的，但我不确定这是否可能。

有一个类resultText但该类在用户输入文本的任何地方使用，而不仅仅在签名中使用。 所以我无法抓住这一点。

Answer 1

即使在其他地方使用了resultText类，我仍然建议使用类选择器作为起点，否则你将在整个文档中寻找注释节点。

从匹配的元素中，您可以获取父元素的内容（） ，使用filter（）隔离注释节点（它们的nodeType属性等于8 ），并将这些节点的值与您的Signature字符串进行比较：

$(".resultText").parent().each(function() {
    var $this = $(this);
    var signature = $this.contents().filter(function() {
        return this.nodeType == 8 && this.nodeValue == "Signature";
    });
    if (signature.length) {
        // Signature found, $this is the <td> element.
        $this.closest("tr").remove();  // For example.
    }
});

Answer 2

您可以使用.contents()来获取元素的所有子节点： http ： //api.jquery.com/contents

来自文档：

获取匹配元素集中每个元素的子元素，包括文本和注释节点。

$('tr').each(function (index, obj) {
    $(this).children('td').contents();//this selects all the nodes in each TD element in the table, including comment nodes
});

这是一个演示： http ： //jsfiddle.net/NLhz9/1/

Answer 3

由于脚本基本上只适合您，因此请使用xpath查找注释。

尝试这样的事情：

var comment, comments = document.evaluate('//comment()', document);
while ((comment=comments.iterateNext())) {
  if (comment.data=='Signature') { // found one
    comment.parentNode.parentNode.removeChild(comment.parentNode);
  }
}