Có một API DOM để truy vấn các nút nhận xét không?

Question

Tôi có một tài liệu với một lời nhận xét gỡ lỗi trong nó trông như thế này:

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

Có cách nào để truy vấn DOM để truy cập vào nút này? Tôi đang tìm kiếm một giải pháp vani JavaScript, mà không cần sự trợ giúp của bất kỳ thư viện nào.

Suy nghĩ đầu tiên của tôi là tìm kiếm chiều sâu đầu tiên DOM và so sánh các nút được tìm thấy dựa vào giá trị loại nút cho các nhận xét, Node.COMMENT_NODE. Có cách nào dễ hơn không?

Answer 1

Có những TreeWalker API:

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

này không được hỗ trợ bởi IE8 và thấp hơn.

T.J. trong các nhận xét được cung cấp một số link to the specs. Tôi luôn sử dụng TreeWalkers, nhưng trong trường hợp của bạn, NodeIterator cũng không sao.

Answer 2

Thuộc tính lõi nodeType cho phép bạn phân biệt giữa các loại nút. Trong trường hợp cụ thể này, 8 đại diện cho các bình luận. Vì họ không có bộ chọn, bạn sẽ cần phải lặp qua cha mẹ của họ để có được chúng (mà hút, tôi biết). Các mã sau lọc chúng ra cho bạn:

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

Và jQuery-less phiên bản của riêng tôi, vì một số người không có nó:

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; 
}; 

Nếu bạn muốn tìm kiếm trên một cụ thể , hãy liên kết lại cuộc gọi document.getElementsByTagName với biến mà bạn chọn.

Chỉnh sửa: fiddle để chứng minh việc sử dụng, được thực hiện bởi Jason Sperske!