Исправление не может установить свойство 'inner HTML' из неопределенного при использовании getElementsByClassName

Question

for(i = 0; i <= document.getElementsByClassName("contC").length; i++){ 
    document.getElementsByClassName("contC")[i].innerHTML = "aaa";
};

Answer 1

Ошибка в том, что вам нужно < вместо <= в вашем для l oop. Если document.getElementsByClassName("contC").length равно 5, то document.getElementsByClassName("contC")[5] равно undefined, 4 будет последним индексом.

Это прекрасно работает:

for(i = 0; i < document.getElementsByClassName("contC").length; i++){ 
    document.getElementsByClassName("contC")[i].innerHTML = "aaa";
};

Однако не нужно , чтобы позвонить document.getElementsByClassName дважды:

const els = document.getElementsByClassName("contC")
for (let i = 0; i < els.length; i++) { 
    els[i].innerHTML = "aaa";
}

или:

const els = document.getElementsByClassName("contC")
Array.from(els).forEach(e => e.innerHTML = "aaa")

Answer 2

Попробуйте использовать для l oop как:

for (let elem of document.getElementsByClassName("contC")) {
  elem.innerHTML = "aaa";
}

Answer 3

Ваш l oop повторяется от 0 до длины коллекции. Необходимо выполнить итерацию до document.getElementsByClassName("contC").length - 1 или изменить условие с <= на < Пока условие <= последний элемент находится вне диапазона сбора. Если коллекция имеет 4 элемента, индексы 0 ... 3, коллекция [4] выходит за пределы

for(i = 0; i <= document.getElementsByClassName("contC").length - 1; i++){ 
    document.getElementsByClassName("contC")[i].innerHTML = "aaa";
};

<div class='contC'></div>
<div class='contC'></div>
<div class='contC'></div>
<div class='contC'></div>

Answer 4

Ваше условие выхода для l oop неверно. Вы проверяете, является ли переменная i меньшей ИЛИ РАВНОЙ длины вашего массива. Но, поскольку индекс массива начинается с 0, позиция array[array.length] не существует (она изменяется от 0 до array.length - 1. Смысл того, почему вы получаете эту ошибку.

for(let i = 0; i < document.getElementsByClassName("contC").length; i++){ 
    document.getElementsByClassName("contC")[i].innerHTML = "aaa";
};

Ниже приведена улучшенная версия из вашего кода. Вот что я изменил.

• Я использовал ключевое слово let для правильной инициализации переменной.
• Я сохранил HTML узел в массив вместо того, чтобы готовить весь документ на каждой итерации.
• Я удалил точку с запятой после закрывающей скобки for l oop, так как в этом нет необходимости.

const nodes = document.getElementsByClassName("contC");
for(let i = 0; i < nodes.length; i++){ 
    nodes[i].innerHTML = "aaa";
}