Search code examples
javascriptinternet-explorerforeachinternet-explorer-11ecmascript-5

Javascript - forEach() loops not working on IE11


forEach loops are supposed to be working in IE11 and diplay

Object doesn't support property or method 'forEach'.

It should be working since it's an ECMAScript-5 function and IE11 supports it.

However, my code here is not working:

var alltable = document.querySelectorAll('*[id^="table_"]'); //Select all elements with the id starting by "table_"
    alltable.forEach(function(element) {
                // Do some code
                });

Any idea why ?


Solution

  • Well myself,

    forEach() is actually working on IE11, just be careful on how you call it.

    querySelectorAll() is a method which return a NodeList. And on Internet Explorer, foreach() only works on Array objects. (It works with NodeList with ES6, not supported by IE11).

    To fix this, some would advice a polyfill, which could work great, but you can also simply convert your NodeList into an array with the slice.call() method: (Explained here)

    var alltable = document.querySelectorAll('*[id^="table_"]'); //Select all elements with the id starting by "table_"
    var alltableArray= Array.prototype.slice.call(alltable);
        alltableArray.forEach(function(element) {
                    // Do some code
                    });
    

    Or:

    var alltable = Array.prototype.slice.call(document.querySelectorAll('*[id^="table_"]')); //Select all elements with the id starting by "table_"
        alltable.forEach(function(element) {
                    // Do some code
                    });
    

    To sum up: Be sure you're using it on an Array object and not a NodeList.

    Hope that can help someone.