17

次のコードのように、DOMオブジェクトの配列を逆にすることで何が問題になる可能性がありますか。

var imagesArr = new Array();
imagesArr = document.getElementById("myDivHolderId").getElementsByTagName("img");
imagesArr.reverse();

Firefox 3では、reverse()メソッドを呼び出すと、スクリプトの実行が停止し、Web開発者ツールバーのコンソールに次のエラーが表示されます。

imagesArr.reverse is not a function

変数はimagesArrforループで繰り返すことができ、のような要素にアクセスできるので、メソッドimagesArr[i]を呼び出すときに配列として表示されないのはなぜですか？reverse()

4

6 に答える 6

16

getElementsByTagnameは実際にはNodeList構造を返すためです。構文上の便宜のためにインデックスプロパティのような同様の配列がありますが、配列ではありません。たとえば、エントリのセットは実際には常に動的に更新されています。myDivHolderIdの下に新しいimgタグを追加すると、imagesArrに自動的に表示されます。

詳細については、 http：//www.w3.org/TR/DOM-Level-2-Core/core.html#ID-536297177を参照してください。

于 2008-09-05T12:17:39.777 に答える
10

getElementsByTag()Array の代わりに NodeList を返します。NodeList を Array に変換できますが、配列は別のオブジェクトになるため、逆にしても DOM ノードの位置には影響しないことに注意してください。

var listNodes = document.getElementById("myDivHolderId").getElementsByTagName("img");
var arrayNodes = Array.slice.call(listNodes, 0);
arrayNodes.reverse();

位置を変更するには、DOM ノードを削除し、それらをすべて正しい位置に再度追加する必要があります。

Array.prototype.slice.call(arrayLike, 0)は、配列のようなものを配列に変換する優れた方法ですが、JavaScript ライブラリを使用している場合は、実際にはさらに優れた/高速な方法を提供する場合があります。たとえば、jQuery には$.makeArray(arrayLike).

NodeList で Array メソッドを直接使用することもできます。

Array.prototype.reverse.call(listNodes);
于 2008-09-05T13:04:30.087 に答える
1

最初の行は、変数への割り当てを強制しないため、無関係です。javascriptは逆に機能します。imagesArrはTypeArray（）ではなく、getElementsByTagName（ "img"）の戻り型が何であれです。この場合、Firefox3のHtmlCollectionです。

このオブジェクトの唯一のメソッドは、インデクサーと長さです。逆に作業するには、逆方向に繰り返すだけです。

于 2008-09-05T12:16:42.933 に答える