IE supports forEach(...) when invoked fromthe console but not when called from the code
Basically document.querySelectorAll
would return a nodeList
an array like object not an array. You have to convert it to an array before invoking array functions over that.
var menus = document.querySelectorAll("ul.application>li>a");
menus = [].slice.call(menus);
menus.forEach(function(element) { ... });
If your environment supports ES6 then you can use Array.from()
var menus = document.querySelectorAll("ul.application>li>a");
menus = Array.from(menus);
menus.forEach(function(element) { ... });
It is not a problem of the browser, it is more like you get an array like object, with querySelectorAll
. It returns a NodeList
, which is iterable, but not directly with array methods.
But you can borrow the method from Array.prototype
, like this one
Array.prototype.forEach.call(menu, function(element) { /* ... */ });
If you like to get first a real array, you could convert it with
array = Array.apply(null, menu);
Little late, but it might be useful if someone has the same problem and doesn't want/can't replace all forEach methods with [].forEach.call(elements, fn(el))
. Here is polyfill that works for ie11
if (! Object.getOwnPropertyDescriptor(NodeList.prototype, 'forEach')) {
Object.defineProperty(NodeList.prototype, 'forEach', Object.getOwnPropertyDescriptor(Array.prototype, 'forEach'));
}