Q&A
addEventListenerを用いて、ボタンがクリックされたらconsoleにIt got clicked!
と表示したいです。
しかし、consoleには以下のようなエラーが出てしまいます。</body>の直前でscriptを読み込ませているのでが、原因がわかりませんので、ご教授願います。
Uncaught TypeError: Cannot read property 'addEventListener' of null at HTMLDocument.<anonymous>
・index.html
<!DOCTYPE html> <html lang="ja"> <head> <meta charset="utf-8"> <title>JavaScript Basics</title> </head> <body> <button id=”butts”>Click Me!</button> <button class="cool">Click me also!</button> <script src="./JS/event.js"></script> </body> </html>
・event.js
'use strict'; { document.addEventListener("DOMContentLoaded", function(){ const butts = document.querySelector('.butts'); butts.addEventListener('click', function(){ console.log('It got clicked!'); }); }); }
回答1件
0
ベストアンサー
HTML要素を取れていないと言ってるので、
buttsを定義できていない。
script
1const butts = document.querySelector('.butts');
ここじゃないかな？ id取るから.じゃなくて#だったような。
maisumakun様よりご指摘いただきましたので追記をばっ
※ご指摘ありがとうございます！
html
1- <button id=”butts”>Click Me!</button> 2+ <button id="butts">Click Me!</button>
引用符が全角？になってるかな。”こっちじゃなくて
半角に直してくださいね。"こっち！
投稿2021/03/17 00:33
編集2021/03/17 00:56
退会済みユーザー
総合スコア0
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2021/03/17 00:36
退会済みユーザー
2021/03/17 00:49
2021/03/17 02:06