JavaScript
🚨 TypeError: Cannot set properties of null (setting 'textContent')
nullに対してプロパティを設定しようとしている
😰 こんな症状
getElementByIdでnullが返っているのにプロパティを設定してエラーになる。DOM操作で起きやすいよ。
🔍 原因
document.getElementByIdなどでnullが返っているのに、そのままtextContentやinnerHTMLなどのプロパティを設定しようとしたよ。IDのタイプミスやスクリプトの読み込み順（DOM構築前に実行）が原因だよ。
❌ エラーが起きるコード
document.getElementById("x").textContent = "hi";
// 要素が null✅ 直し方
1. IDが正しいか確認する（HTMLのid属性とJSの文字列が完全一致）。 2. scriptタグをbodyの末尾に置くか、defer属性を付ける。 3. DOMContentLoadedイベント内で実行する。 4. if (el) el.textContent = '...'のようにnullチェックする。
✅ 修正後のコード
const el = document.getElementById("x");
if (el) el.textContent = "hi";この解決法は役立ちましたか？
🔗 関連するエラー
- Uncaught TypeError: Cannot read properties of null — getElementById の id が存在しない
- TypeError: Cannot read properties of null（null参照） — nullのプロパティにアクセスしている
- TypeError: Cannot read properties of undefined (reading 'length') — undefinedに対して.lengthを呼んでいる
- ボタンを押しても何も起きない — getElementById の id 不一致
- ReferenceError: Cannot access before initialization — let/constの宣言前にアクセスしている
🔗 別カテゴリの関連エラー
📖 この問題を学べるレッスン
📝 関連ブログ記事
- プログラミングのエラーメッセージの読み方 — エラーの読み方を基礎から解説
- JavaScriptとは？初心者向けにわかりやすく解説 — 変数・関数・イベントの基本
- JavaScriptでボタンクリックを動かす方法 — ボタンクリック時の動作を解説