エラーが発生したとき、どこを調べるべきかについて説明していきます。
- デベロッパーツールの見方
- エラーメッセージの読み方
デベロッパーツールの見方
・コードを書いていくと間違ってしまうことがあります。特にJavaScriptは複雑な上に大文字小文字を区別するのでそういったことも多々あります。
・エラーがあると読み込んでくれなかったり動作しないこともありますので今回はエラーメッセージを読み解く方法について学んで行きます。
・ではうまく動作しなかった場合どのように調べればいいのかと言うとブラウザに初期設定されているディベロッパツールを使ってみましょう。今回はchromeを使っていきます。
・まずメニューから3つの点が縦に並んでいるアイコンをクリックしてその他のツール→デベロッパーツールと選びます。
・デベロッパーツールが出てきたらパネルがあるのでその中からConsoleを選択します。そうすると赤い背景になっているエラーメッセージが見れると思うので内容を確認してみましょう。
エラーメッセージの読み方
・エラーメッセージは英語で書かれていますがどのへんが間違っていっるかなどはぱっと見で理解できると思うので恐れずに内容を確認してみましょう。
・今回の場合はindex.htmlの16行目のdocument.GetElementByIdが怪しいとなっているっぽいのでそのへんをチェックしてみましょう。
・GetElementのｇは小文字なのでそこを直してあげれば無事に動作するようになります。