0

安全とは、によって作成された NodeListdocument.getElementsById('*');がライブ オブジェクトであることを意味します。一部の要素は、JS エンジンがループするときに動的に追加または削除されます。

私がやろうとしていることは、DOM全体をループすることです（これはグリースモンキースクリプトにあるため、通常のWeb使用ではありませんが、そこにも当てはまると思います）、ノードCSSがいくつかのルールに一致するかどうかを確認し、その変更に従ってCSS。

この処理には時間がかかります。また、Web サイトには複数のスクリプト (画像の変更/ニュース記事の変更など) が実行されているため、遅かれ早かれ DOM ノードの追加と削除が頻繁に行われるため、処理中にノードが消えてしまう場合があります。

そして、速いということは、再帰的に行う方が良いということです：

function traverseDOM(node,f) {
  if (node.nodeType !== 1) return;
  f.apply(node);
  for (var i = 0; i < node.childNodes.length; i++) {
    traverseDOM(node.childNodes[i],f);
  }
}

（ただし、これはnodeTypeのチェックに時間を浪費します）またはforループによる：

nodes = document.getElementsByTagName('*');
for (var i=0; i<nodes.length; i++) {
  //do my stuff
}

(しかし、これは最後に NodeList の変動する先端に遭遇するという問題があります)

4

3 に答える 3

1

一例ですので、ぜひお試しください。約 170 のノードでテストしたところ、遅すぎませんでしたが、必ずしも高速でもありませんでした。

function walk (node, func) {
    func(node);
    node = node.childNodes[0];

    while (node) {
        walk(node, func);
        node = node.nextSibling;
    }
}

var doc = document; //save a reference to the document (might be a tiny bit faster... not sure)
var bd = doc.body; //start to walk the DOM from the body
var o = doc.getElementById('some_div'); //some div to output to
var arr = []; //array to collect all nodes

walk(bd, function(n){
    if (n.nodeType === 1) {
        n.style.border = "2px solid red"; //change the border color for each node that was found
        o.innerHTML += "<pre>" + n.nodeName + "</pre>"; //output each node's name to a div
        arr.push(n); //add each node to the array
    }
});

console.log(arr.length); //log the total number of nodes affected
于 2012-01-04T13:21:43.693 に答える
0

w3c要素トラバーサル仕様があります。http：//www.w3.org/TR/ElementTraversal/#example-3.2の例を参照してください。

于 2012-01-04T11:43:01.870 に答える
0

JavaScriptはシングルスレッドです。一度に実行できる関数は1つだけです。DOMを反復処理している間は、変更できないはずです。

于 2012-01-04T11:35:19.003 に答える