IEはコンソールから呼び出されたときにforEach（...）をサポートしますが、コードから呼び出されたときはサポートしません

Question

コンソールでこのスニペットを実行しています。 IEでは、期待どおりの出力を生成します。参照のためにCrとFFで同じことを実行すると、動作の合同性が確認されます。オブジェクトがそれに宣言されていないのforEach（...）を持っていることを私に言って

["a", "b"].forEach(function(element) { 
    console.log(element); 
}); 

次のスクリプトを実行している場合しかし、私はエラーを取得しています。この問題はIEでは発生しますが、CrやFFでは発生しません。

var menus = document.querySelectorAll("ul.application>li>a"); 
menus.forEach(function(element) { ... } 

私は変数メニューが宣言されていることをチェックしましたし、それはそれの要素を選ぶことは、私が期待するものを作り出すすなわちメニュー[0]が存在し、タグです。それはIEとは少し違って見えますが、それはちょっと違うかもしれません。

私はCrとFFで作業することを祝福されていますので、IEに関する私の経験は限られています。グーグルは私に多くの知恵を与えなかった。

さらにトラブルシューティングを行うにはどうすればよいですか？

Answer 1

基本的にdocument.querySelectorAllは、nodeListという配列をオブジェクトではなく配列として返します。配列関数を呼び出す前に配列に変換する必要があります。ご使用の環境がES6をサポートしている場合

var menus = document.querySelectorAll("ul.application>li>a"); 
menus = [].slice.call(menus); 
menus.forEach(function(element) { ... }); 

その後、あなたはそれはそれはあなたがquerySelectorAllで、オブジェクトのように配列を得るより多くのようなものです、ブラウザの問題ではありませんArray.from()

var menus = document.querySelectorAll("ul.application>li>a"); 
menus = Array.from(menus); 
menus.forEach(function(element) { ... }); 

Answer 2

使用することができます。それはNodeListを返します。これは反復可能ですが、配列メソッドを直接使用することはできません。

しかし、あなたは、あなたが最初の本当の配列を取得したい場合は、あなたがのNodeListではないという理由だけで

array = Array.apply(null, menu);