Question

我已将forEach polyfill添加到我的JavaScript文件的顶部，但是Internet Explorer仍然说它不支持该功能。

我基本上想要遍历querySelector的结果，但我在脚本中的其他一些数组对象上使用forEach。

这一切都适用于Chrome。

// Production steps of ECMA-262, Edition 5, 15.4.4.18
// Reference: http://es5.github.io/#x15.4.4.18
if (!Array.prototype.forEach) {

  Array.prototype.forEach = function(callback/*, thisArg*/) {

    var T, k;
    if (this === null) {
      throw new TypeError('this is null or not defined');
    }
    var O = Object(this);
    var len = O.length >>> 0;
    if (typeof callback !== 'function') {
      throw new TypeError(callback + ' is not a function');
    }
    if (arguments.length > 1) {
      T = arguments[1];
    }
    k = 0;
    while (k < len) {
      var kValue;
      if (k in O) {
        kValue = O[k];
        callback.call(T, kValue, k, O);
      }
      k++;
    }
  };
}

(function() {

  var instance = null,
      container;

  // Constructor
  this.MarvLightbox = function() {
    // Initialise plugin
    this.init();
  };

  // Initilise the plugin
  MarvLightbox.prototype.init = function() {

    document.querySelectorAll('[data-click]').forEach(function(e) {
      e.addEventListener('click', [clickevent]);
    });

  };

}());

不应该添加polyfill修复此问题与IE？

Answer 1

使IE9 +支持的另一种方法forEach：

＆＃13;

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
</head>
<body>
    <span class="demo">See me.</span>
    <span class="demo">See me.</span>
    <span class="demo">See me.</span>
    <span class="demo">See me.</span>
    <script>
        // Function to make IE9+ support forEach:
        (function() {
            if (typeof NodeList.prototype.forEach === "function")
                return false;
            else
                NodeList.prototype.forEach = Array.prototype.forEach;
        })();

        // Works with Nodelists (i.e. HTMLcollections):
        var demos = document.querySelectorAll('.demo');
        demos.forEach(function(item) {
            item.style.color = 'red';
        })

        // As well as with Arrays:
        var gurkins = ['gur1', 'gur2', 'gur3'];
        gurkins.forEach(function(item) {
            console.log(item);
        });
    </script>
</body>
</html>

＆＃13;

在IE11中测试过，根据其模拟功能，它也适用于10和9（不是8）。

Answer 2

您正在向Array对象添加原型，并尝试在NodeList（这是querySelectorAll返回而不是数组）上使用它，但它不会起作用。从节点列表中创建一个数组，或使用

Array.prototype.forEach.call(document.querySelectorAll('[data-click]'), function (e) {
    // your code
});

即使使用Polyfill，IE也不支持每个。

2 个答案: