innerHTMLで取得した値を.pushで追加できない

Question

前提・実現したいこと

innerHTMLにてHTML側から取得したテキストの値を配列内に格納したいですが、うまくいきません。
下記コードのようにinnerHTMLの値は正常に表示されるものの、配列への代入ができずコンソールにunderfiendと表示されてしまいます。

よろしくお願いします。

該当のソースコード

// 画面ロード後に実行
document.addEventListener('DOMContentLoaded', function() {

	console.log("start");

	// aの値を格納する配列
	let a = new Array();

	// 配列内にHTMLから数値を取得
	let classA = document.getElementsByClassName("a");

	for(var i = 1; i < classA.length; i++) {
		console.log(classA[i].innerHTML);	// ここで値は正常に表示される
		a.push(classA[i].innerHTML);
		console.log(a[i]);					// underfiend
	}
}, false);

Comments

[m.ts10806]

何かエラーメッセージは表示されていますか？「代入自体が失敗している」ならエラーが出ていそうですし、そうでなければ別の理由がありそうです。a以外の変数名（もうちょっと長く意味がありそうな名前）にした場合も同じですか？

Answer 1

配列に代入はされていました。
iが1から始まっているので、
最初のa.pushで入るのは、a[1]ではなくa[0]です。

そもそも、

let classA = document.getElementsByClassName("a");

で取得した0番目の要素が飛ばされているので、

    for(var i = 0; i < classA.length-1; i++) {
        console.log(classA[i].innerHTML);    // ここで値は正常に表示される
        a.push(classA[i].innerHTML);
        console.log(a[i]);
    }

０から始まり、classA.length-1までとすれば、解決するかと思います。

Comments

[退会済みユーザー]

凡ミスで質問してしまい恥ずかしい限りです…。
お早い回答ありがとうございました！

Answer 2

例えば最初のi=1のときconsole.log(a[i])の時点ではa[0]しか存在しないのにa[1]を参照しているからです。

配列のインデックスは0から始まります。

Comments

[退会済みユーザー]

配列自体に値は格納されていたのを確認できました、
凡ミスで質問してしまいお恥ずかしい限りです…。

とてもお早い回答ありがとうございました！！