Почему for работает, а forEach не работает?

Question

У меня есть функция, которая дезактивирует инпуты:

function disableInputsAndSelects() {
  for (var i = 0; i < allInputsAndSelects.length; i++) {
    allInputsAndSelects[i].setAttribute('disabled', 'disabled');
  }
}

И есть функция, которая их активирует:

function activateInputsAndSelects() {
  allInputsAndSelects.forEach(function (el) {
    el.removeAttribute('disabled');
  });
}

Но если я пытаюсь переписать функцию дезактивации на forEach, то она не работает:

function disableInputsAndSelects
  allInputsAndSelects.forEach(function (el) {
    el.setAttribute('disabled');
  });
 }

Что не так?

Весь код

Answer 1

В таких случаях, первое место, куда надо смотреть, - консоль браузера и ошибки в ней.

  allInputsAndSelects.forEach(function (el) {
    el.setAttribute('disabled', 'disabled');
  });

Answer 2

Дело не в методе forEach.

Метод setAttribute() указывает атрибуты по правилам XHTML. Они предполагают формат атрибут='значение'.

Поэтому вы можете использовать forEach, однако метод setAttribute должен иметь вид setAttribute('disabled', 'disabled')

Answer 3

Потому что атрибут не синхронизируется со свойством. Менять атрибут неправильно, надо менять свойство.

var allInputs = document.querySelectorAll('input')

function disable() {
  allInputs.forEach(function (el) {
    el.disabled = true;
  });
}

function activate() {
  allInputs.forEach(function (el) {
    el.disabled = false;
  });
}

document.getElementById('act').addEventListener('click', activate)
document.getElementById('dis').addEventListener('click', disable)

<p><input value=a> <input value=b> <input value=c>

<p><button id=act>activate</button> <button id=dis>disable</button>

БЛОГ НА HUSL

Почему for работает, а forEach не работает?

Ответы (3 шт):