Как сделать, чтобы NodeList.prototype.forEach заработал в Internet Explorer?

Question

[StanislavChunikhin]

Есть код JS, в нем применен метод forEach, который не работает в IE. Как это можно переписать с помощью простого for?

код

var cards = document.querySelectorAll(".card");

cards.forEach(function(cardDiv){

var card = cardDiv.querySelector(".filling");
var body = cardDiv.querySelector(".card-body");
var background = cardDiv.querySelector(".weight");
var cardhead = cardDiv.querySelector(".card-head");
var cardcorner = cardDiv.querySelector(".card-corner");
var link = cardDiv.querySelector('.buy p:nth-child(1) a');
var paragraph1 = cardDiv.querySelector('.buy p:nth-child(1)');
var paragraph2 = cardDiv.querySelector('.buy p:nth-child(2)');
var paragraph3 = cardDiv.querySelector('.buy p:nth-child(3)');


link.addEventListener("click", function(event) {
  event.preventDefault();
  body.classList.add("border-color-selected");
  background.classList.add("background-weight-color-selected");
  cardhead.classList.add("head-border-color-selected");
  cardcorner.classList.add("corner-selected");
  paragraph1.classList.remove("display");
  paragraph2.classList.add("display");
  card.classList.remove('default');
  card.classList.add('selected');
});


card.addEventListener("click", function(event) {
  event.preventDefault();
  if (card.classList.contains('default')) {
    body.classList.add("border-color-selected");
    background.classList.add("background-weight-color-selected");
    cardhead.classList.add("head-border-color-selected");
    cardcorner.classList.add("corner-selected");
    paragraph1.classList.remove("display");
    paragraph2.classList.add("display");
    card.classList.remove('default');
    card.classList.add('selected');

  } else if (card.classList.contains('selected')) {
    body.classList.remove("border-color-selected");
    body.classList.add("card-body-disabled");
    background.classList.remove("background-weight-color-selected");
    background.classList.add("background-weight-color-disabled");
    cardhead.classList.remove("head-border-color-selected");
    cardhead.classList.add("color-disabled");
    cardcorner.classList.remove("corner-selected");
    cardcorner.classList.add("corner-disabled");
    paragraph2.classList.remove("display");
    paragraph3.classList.add("display");
    card.classList.remove('selected');
    card.classList.add('disabled');

  } else if (card.classList.contains('disabled')) {
    body.classList.remove("card-body-disabled");
    background.classList.remove("background-weight-color-disabled");
    cardhead.classList.remove("color-disabled");
    cardcorner.classList.remove("corner-disabled");
    paragraph1.classList.add("display");
    paragraph3.classList.remove("display");
    card.classList.remove('disabled');
    card.classList.add('default');
  }
});
});

Answer 1

[0xD34F]

Вариант раз, воспользоваться forEach'ем массива:

Array.prototype.forEach.call(cards, function(cardDiv) {
  // ...
});

Вариант два, переписать через цикл for:

for (var i = 0; i < cards.length; i++) {
  var cardDiv = cards[i];
  // ...
}

Вариант три - найти и добавить полифилл.

Comments

[StanislavChunikhin]

Спасибо Огромное!!!