脱jQueryと言われてもう何年も経ちますが、私は一向に脱しておりませんw。
そんな私でもたまには Vanilla JS なるものを使いたくなる時があります。そしてたまにしか使わないので、けっこう同じエラーを出しますw。
なので、また同じエラーが出たときにすぐ解決できる用のメモです。(新たなエラーに出会うごとに更新します)
getElementsByClassName(…).addEventListener is not a function
getElementsByClassName()
を使っていつも出てしまうエラーがこちら。
document.getElementsByClassName(‘className’).addEventListener(“click”, function(){console.log(hoge);}, false);
これは getElementsByClassName()
で要素を取得して、クリックイベントを発生させたかったコード。
getElementsByClassName() にはfor文をセット
getElementsByClassName()
は「配列風オブジェクト」が返ってくるのでfor文で回して取得する。
const className = document.getElementsByClassName('className');
for(var i = 0; i < className.length; i++) {
className[i].addEventListener("click", function () {
console.log(className);
}, false);
}
カテゴリー : JavaScript