Hướng dẫn how do i iterate through an html object in javascript? - làm cách nào để lặp qua một đối tượng html trong javascript?

Tôi đang cố gắng lặp lại tất cả các yếu tố trên một trang, vì vậy tôi muốn kiểm tra mọi yếu tố tồn tại trên trang này cho một lớp đặc biệt.

Vì vậy, làm thế nào để tôi nói rằng tôi muốn kiểm tra mọi yếu tố?

Isherwood

54,9K16 Huy hiệu vàng108 Huy hiệu bạc149 Huy hiệu đồng16 gold badges108 silver badges149 bronze badges

Đã hỏi ngày 23 tháng 11 năm 2010 lúc 13:13Nov 23, 2010 at 13:13

Florian Müllerflorian MüllerFlorian Müller

7.24125 Huy hiệu vàng76 Huy hiệu bạc120 Huy hiệu đồng25 gold badges76 silver badges120 bronze badges

5

Bạn có thể chuyển một

if [document.querySelectorAll]
    var clsElements = document.querySelectorAll[".mySpeshalClass"];
else
    // loop through all elements instead

if [document.querySelectorAll]
    var clsElements = document.querySelectorAll[".mySpeshalClass"];
else
    // loop through all elements instead

var all = document.getElementsByTagName["*"];

for [var i=0, max=all.length; i < max; i++] {
     // Do something with the element here
}

Lưu ý rằng bạn có thể sử dụng

if [document.querySelectorAll]
    var clsElements = document.querySelectorAll[".mySpeshalClass"];
else
    // loop through all elements instead

if [document.querySelectorAll]
    var clsElements = document.querySelectorAll[".mySpeshalClass"];
else
    // loop through all elements instead

Điều này chắc chắn sẽ tăng tốc vấn đề cho các trình duyệt hiện đại.

Trình duyệt bây giờ hỗ trợ foreach trên Nodelist. Điều này có nghĩa là bạn có thể trực tiếp lặp các yếu tố thay vì viết của riêng bạn cho Loop.

document.querySelectorAll['*'].forEach[function[node] {
    // Do whatever you want with the node object.
}];

Hiệu suất Lưu ý - Làm hết sức mình để phạm vi những gì bạn đang tìm kiếm bằng cách sử dụng một bộ chọn cụ thể. Một bộ chọn phổ quát có thể trả về nhiều nút tùy thuộc vào độ phức tạp của trang. Ngoài ra, hãy xem xét sử dụng

if [document.querySelectorAll]
    var clsElements = document.querySelectorAll[".mySpeshalClass"];
else
    // loop through all elements instead

7 thay vì

if [document.querySelectorAll]
    var clsElements = document.querySelectorAll[".mySpeshalClass"];
else
    // loop through all elements instead

8 khi bạn không quan tâm đến trẻ em

if [document.querySelectorAll]
    var clsElements = document.querySelectorAll[".mySpeshalClass"];
else
    // loop through all elements instead

9. - Do your best to scope what you're looking for by using a specific selector. A universal selector can return lots of nodes depending on the complexity of the page. Also, consider using

if [document.querySelectorAll]
    var clsElements = document.querySelectorAll[".mySpeshalClass"];
else
    // loop through all elements instead

7 instead of

if [document.querySelectorAll]
    var clsElements = document.querySelectorAll[".mySpeshalClass"];
else
    // loop through all elements instead

8 when you don’t care about

if [document.querySelectorAll]
    var clsElements = document.querySelectorAll[".mySpeshalClass"];
else
    // loop through all elements instead

9 children.

LXG

Huy hiệu vàng 11.6K1146 Huy hiệu bạc70 Huy hiệu đồng11 gold badges46 silver badges70 bronze badges

Đã trả lời ngày 23 tháng 11 năm 2010 lúc 13:15Nov 23, 2010 at 13:15

18

Đã tìm kiếm giống nhau. Không hẳn là chính xác lắm. Tôi chỉ muốn liệt kê tất cả các nút dom.

var currentNode,
    ni = document.createNodeIterator[document.documentElement, NodeFilter.SHOW_ELEMENT];

while[currentNode = ni.nextNode[]] {
    console.log[currentNode.nodeName];
}

Để có được các phần tử với một lớp cụ thể, chúng ta có thể sử dụng chức năng bộ lọc.

var currentNode,
    ni = document.createNodeIterator[
                     document.documentElement, 
                     NodeFilter.SHOW_ELEMENT,
                     function[node]{
                         return node.classList.contains['toggleable'] ? NodeFilter.FILTER_ACCEPT : NodeFilter.FILTER_REJECT;
                     }
         ];

while[currentNode = ni.nextNode[]] {
    console.log[currentNode.nodeName];
}

Tìm thấy giải pháp trên mdn

Đã trả lời ngày 3 tháng 10 năm 2014 lúc 1:33Oct 3, 2014 at 1:33

truyền thốngtraditional

95110 Huy hiệu bạc19 Huy hiệu đồng10 silver badges19 bronze badges

3

Như mọi khi, giải pháp tốt nhất là sử dụng đệ quy:

loop[document];
function loop[node]{
    // do some thing with the node here
    var nodes = node.childNodes;
    for [var i = 0; i  0]{
            loop[nodes[i]];
        }
    }
}

Không giống như các đề xuất khác, giải pháp này không yêu cầu bạn tạo một mảng cho tất cả các nút, vì vậy nó nhẹ hơn trên bộ nhớ. Quan trọng hơn, nó tìm thấy nhiều kết quả hơn. Tôi không chắc những kết quả đó là gì, nhưng khi thử nghiệm trên Chrome, nó sẽ tìm thấy nhiều nút hơn khoảng 50% so với

document.querySelectorAll['*'].forEach[function[node] {
    // Do whatever you want with the node object.
}];

Simson

3.1862 Huy hiệu vàng23 Huy hiệu bạc34 Huy hiệu đồng2 gold badges23 silver badges34 bronze badges

Đã trả lời ngày 8 tháng 3 năm 2017 lúc 17:50Mar 8, 2017 at 17:50

Ilya Gazmanilya GazmanIlya Gazman

30.4K21 Huy hiệu vàng133 Huy hiệu bạc211 Huy hiệu đồng21 gold badges133 silver badges211 bronze badges

3

Dưới đây là một ví dụ khác về cách bạn có thể lặp qua tài liệu hoặc một phần tử:

function getNodeList[elem]{
var l=new Array[elem],c=1,ret=new Array[];
//This first loop will loop until the count var is stable//
for[var r=0;r
 {}].