Отключение нескольких элементов в массиве с помощью JavaScript

Question

Текущий процесс установки нескольких входов на disabled работает для меня, но, кажется, слишком много кода из-за нескольких циклов for:

var textEditors = document.getElementsByClassName('textEditor'),
        textareas = document.getElementsByTagName('textarea'),
        radioInputs = document.getElementsByClassName('radioSelect'),
        textInputs = document.getElementsByTagName('input');

    for (var i = 0; i < textEditors.length; i++) {
        textEditors[i].disabled = true;
    }
    for (var g = 0; g < textInputs.length; g++) {
        textInputs[g].disabled = true;
    }
    for (var f = 0; f < textareas.length; f++) {
        textareas[f].disabled = true;
    }
    for (var z = 0; z < radioInputs.length; z++) {
        radioInputs[z].disabled = true;
    }

Но это выше работает для меня хорошо.Ниже приведено то, что, как я предполагаю, будет работать вместо этого - поместить все элементы в один массив и выполнить итерацию по одному массиву, чтобы установить для каждого значение disabled.Когда я смотрю HTMLCollection через console.log, он говорит disabled:true, но элемент на экране не отключен.Что мне здесь не хватает?

var textEditors = document.getElementsByClassName('textEditor'),
        textareas = document.getElementsByTagName('textarea'),
        radioInputs = document.getElementsByClassName('radioSelect'),
        textInputs = document.getElementsByTagName('input');

    var normalInputs = [];
    normalInputs.push(textEditors);
    normalInputs.push(textInputs);
    normalInputs.push(radioInputs);
    normalInputs.push(textareas);

    for (var i = 0; i < normalInputs.length; i++) {
        console.log(normalInputs[i])
        normalInputs[i].disabled = true;
    }

Answer 1

Хорошо, дайте всем им один и тот же класс, как .inputs, и получите все их одним выражением:

var items = document.querySelectorAll( '.inputs' );

, если это невозможно, получите все их так:

var items = document.querySelectorAll( 'input, .textEditor, .radioSelect, textarea' );

тогда вы можете исправить это одним циклом для всех них:

for ( var i = 0; i < items.length; i++ )
    items[ i ].disabled = true;

Answer 2

Это будет служить вашим целям.

Во втором методе вы перемещаете захват массива из getElement в normalInputs массив, затем циклически проходите через этот массив и применяете отключениесвойство элементов inputArray, которое в конечном итоге является массивом всех selected elements, а не individual element.

var textEditors = document.getElementsByClassName('textEditor'),
    textareas = document.getElementsByTagName('textarea'),
    radioInputs = document.getElementsByClassName('radioSelect'),
    textInputs = document.getElementsByTagName('input');

var normalInputs = [];
normalInputs.push(textEditors);
normalInputs.push(textInputs);
normalInputs.push(radioInputs);
normalInputs.push(textareas);

normalInputs.forEach(e=>{
  e.forEach(ele =>{
    ele.disabled = true;
  })
})

без ES6

for (var i = 0; i < normalInputs.length; i++) {
      for(let j=0; j< normalInputs[i].length; j++){
      normalInputs[i][j].disabled = true;
     }
  }

лучшеподход это использование concat

var normalInputs = [];
    normalInputs = normalInputs.concat(textEditors,textInputs,radioInputs, textareas);

for(let i=0; i<normalInputs.length; i++){
  normalInputs[i].disabled = true;
}