9

我有一个包含调试注释的文档，如下所示：

<!--SERVER_TRACE {...}-->

有没有办法查询 DOM 来访问这个节点？我正在寻找一个普通的 JavaScript 解决方案，没有任何库的帮助。

我的第一个想法是首先深入搜索 DOM，并将找到的节点与评论的节点类型值进行比较，Node.COMMENT_NODE. 有没有更简单的方法？

4

2 回答 2

12

有TreeWalkerAPI：

var tw = document.createTreeWalker(document, NodeFilter.SHOW_COMMENT, null, null),
    comment;
while (comment = tw.nextNode()) {
    // ...
}

IE8 及更低版本不支持此功能。

评论中的 TJ 提供了规范的链接。我总是只使用 TreeWalkers，但在你的情况下 aNodeIterator也很好。

于 2013-04-22T16:42:45.260 回答
8

nodeType核心属性允许您区分节点类型。在这种特殊情况下，8 代表评论。因为他们没有选择器，你需要遍历他们的父母才能得到他们（这很糟糕，我知道）。以下代码为您过滤掉它们：

$("*").contents().filter(function(){
    return this.nodeType == Node.COMMENT_NODE;
})

还有我自己的 jQuery-less 版本，因为有些人没有它：

function getAllComments() {
    var t = [],
        recurse = function (elem) {
            if (elem.nodeType == Node.COMMENT_NODE) {
                t.push(elem);
            };
            if (elem.childNodes && elem.childNodes.length) {
                for (var i = 0; i < elem.childNodes.length; i++) {
                    recurse(elem.childNodes[i]);
                };
            };
        };
    recurse(document.getElementsByTagName("html")[0]);
    return t;
};

如果您想在特定节点上搜索，请将document.getElementsByTagName调用重新绑定到您选择的变量。

编辑：小提琴演示使用，由Jason Sperske完成！

于 2013-04-22T16:21:11.287 回答