🔇 ボタンを押しても何も起きない

😰 こんな症状

ボタンを押しても何も起きない。コンソールにエラーも出ない。idの不一致で要素取得に失敗しているときに起きるよ。

🔍 原因

document.getElementById('xxx')のid名がHTMLと一致していないよ。nullが返っているけど、nullに対してイベントリスナーを追加してもエラーにならない（無視される）ため、エラーが出ずに「何も起きない」状態になるんだ。

❌ エラーが起きるコード

document.getElementById("buton").click();
// id スペルミスで null

✅ 直し方

1. JavaScriptのgetElementById('xxx')とHTMLのid="xxx"を見比べる。 2. console.log(element)を追加してnullが出たら取得失敗。 3. if (element) element.addEventListener(...)のようにnullチェックを入れる。 4. 開発者ツールのElementsタブでidを検索して確認する。

✅ 修正後のコード

document.getElementById("button").click();

🔗 関連するエラー

• Uncaught TypeError: Cannot read properties of null — getElementById の id が存在しない
• TypeError: Cannot read properties of null（null参照） — nullのプロパティにアクセスしている
• TypeError: Cannot set properties of null (setting 'textContent') — nullに対してプロパティを設定しようとしている
• localStorageからnullが返る — キー名が一致していない
• Uncaught ReferenceError: xxx is not defined — 変数・関数名のタイポ

🔗 別カテゴリの関連エラー

• Cannot read properties of null
• DOM取得がnull（script位置）
• Cannot set properties of null

📖 この問題を学べるレッスン

JavaScriptコースで基礎から学ぶ →

📝 関連ブログ記事

• プログラミングのエラーメッセージの読み方 — エラーの読み方を基礎から解説
• JavaScriptとは？初心者向けにわかりやすく解説 — 変数・関数・イベントの基本
• JavaScriptでボタンクリックを動かす方法 — ボタンクリック時の動作を解説

📖 関連する用語

• JavaScript
• Java・JavaScript の違い
• null・undefined の違い

❓ 関連するQ&A

• console.logの結果はどこで見る？
• ボタンクリックで何も起きない
• letとconstどっちを使う？