Cannot read properties of undefined (reading 'getElementsByTagName')

Question

前提

下記のコードをprintしたら、普通にprintできます。(ERROR無し)

    AAA = document.getElementsByClassName("col_ID")[0].getElementsByTagName('input')[0].value
    console.log(Number(AAA));

    BBB = document.getElementsByClassName("col_ID")[1].getElementsByTagName('input')[0].value
    console.log(Number(BBB));

    CCC = document.getElementsByClassName("col_ID")[2].getElementsByTagName('input')[0].value
    console.log(Number(CCC));

実現したいこと

上記のコードを、下記のコードのように、for loopにしてprintしたいです。

length = document.getElementsByClassName("col_ID").length;
for (let i = 0; i <= length; i++) {
output_int = document.getElementsByClassName("col_ID")[i].getElementsByTagName('input')[0].value;
console.log(Number(output_int));
}

発生している問題・エラーメッセージ

該当のソースコード

140行目がERRORが出てきました

試したこと

for loopにする前、普通でprintできるのに、
何故for loopにすると、ERRORが出てきたでしょうか？

Answer 1

たとえば、
length = document.getElementsByClassName("col_ID").length
の length が 「3」 のとき、

for (let i = 0; i <= length; i++) {

とすると、i は 0 から 3 までの ４個 の値をとります。
i が 3 のとき、
document.getElementsByClassName("col_ID")[i]
すなわち
document.getElementsByClassName("col_ID")[3]
は undefinedになっていると考えられます。

（語弊を恐れずに言えば、「３個しかないのに4個目を取得しようとしたからエラーになっている」というような感じです）

for (let i = 0; i < length; i++) {

としてみてはいかがでしょうか。

Comments

[YUMINAGA]

直ぐ理解しました！
誠にありがとうございます!!!