javascript

javascriptのエラーの確認方法「3秒で確認できます」

投稿日:

Pocket

うも、チャーさんです。

 

あなたはjavascriptのエラーの確認方法を、

知りたいと思っていませんか?

 

 

この記事では、javascriptのエラーを、

確認する方法について書いています。

 

なので、あなたがこの記事を読めば、

javascriptのエラー内容をあなた自身で、

すぐに確認できるようになります。

 

 

そのため、javascriptのエラーの確認方法を、

あなたが知りたければ、このまま下にスクロールして、

読み進めてみてください。

 

 

スポンサードサーチ

javascriptのエラー内容を確認する方法

 

で、早速結論です。

 

javascriptのエラーの確認方法は、

デベロッパーツールのコンソールを、

開くことです。

 

 

というのも、

グーグルクロームで使える、デベロッパーツールでは、

コンソール画面にて、javascriptのエラーを表示してくれます。

 

なので、あなたが書いたjavascriptにもし、

エラーがあった場合、エラーの内容を確認したければ、

デベロッパーツールのコンソールを開きましょう。

 

 

とはいえこれだけだと、イメージがつきづらいと、

思いますので、実際に画像でみてみましょう。

 

以下の画像をご覧ください。

こちらは、僕が意図的に間違いを作って、

エラーを起こしてます。

 

そしてデベロッパーツールのコンソールを開き、

エラー内容を表示しました。

 

javascriptエラー確認方法

 

画像をみた通り、デベロッパーツールのコンソールが、

ちゃんとエラー内容を表示してくれてますね。

 

こんな風に、javascriptでエラーを確認したい場合、

その方法としてデベロッパーツールのコンソール画面を、

開くとしっかり表示してくれます。

 

 

なので、javascript書いたのに動かない、、

エラー内容を確認したいって場合は、

コンソール画面を開きましょう。

 

 

コンソールの開き方

 

で、デベロッパーツールの、

コンソールの開き方ですが、

デベロッパーツールをまず開きましょう。

 

開き方は、クロームの画面上で右クリックをして、

検証というのがあるので、それをクリックしましょう。

 

 

するとデベロッパーツールが開きます。

で開いたら、Elements Consoleと並んでます。

 

javascriptエラー確認方法

(赤文字で表示されてるエラーの上をみてください。

Elements Consoleと並んでる列がありますね)

 

 

なのでそこでConsoleタブをクリックしましょう。

するとコンソールが開き、エラー内容を表示してくれます。

 

 

エラーの解決をしてみましょう

 

ここからは確認方法ではなく少し余談ですが、

今回のエラー内容を解決してみましょう。

 

 

ちなみに今回の画像の場合、エラー内容として、

 

javascript_error_show.html:13 Uncaught TypeError: error.addEventListene is not a function
at javascript_error_show.html:13

 

と表示されてます。

 

 

これを解決するには、

エラーの内容を読みます。

 

javascript_error_show.html:13 Uncaught TypeError:

とまず1文目に書いてます。

 

これは解説すると、javascript_error_show.htmlという、

ファイルの13行目にTypeError、

つまり記述の打ち間違いと表示されてます。

 

 

で打ち間違えてる内容は、

error.addEventListene is not a function

と書いてる部分です。

 

これはイベントリスナーの記述が間違ってる、

と教えてくれまして、どこが間違ってるかというと、

 

イベントリスナーのスペルは、

addEventListenerなのに、

Listenerの最後のrが抜けてますね。

 

 

ということで、エラーが表示されてるわけです。

 

なので、このエラーを解決するには、

javascriptのファイルに戻って、

listeneのとこにrを追加記述します。

 

すると、エラーが消えましたね。

 

 

javascriptエラー解決

 

という訳でこれでエラーが解決できた訳です。

 

上記のエラー内容は一例でしたが、

javascriptのエラーを確認し、

エラー内容を解決していきましょう。

 

 

スポンサードサーチ

まとめ

 

それではまとめに入ります。

 

javascriptのエラーの確認方法ですが、

デベロッパーツールのコンソールを、

開きましょう。

 

するとそこにエラー内容が書いてますので、

エラーの内容を読み、エラー出てる部分を、

修正していきましょう。

 

 

基本javascript書いたのに、

動かない場合はエラーがあるので、

上記の方法で内容を確認してみてください。

 

 

エラーは確認できないと大変ですが、

内容がわかれば解決できるので、

まずはエラー内容の確認からしてみてください。

 

それでは、読んでもらってありがとうございました。

 

チャーさん

-javascript


スポンサードサーチ

関連記事

no image

htmlの中にjavascriptを書いて使う方法

どうも、チャーさんです。   あなたはhtmlの中にjavascriptを書いて、 使いたいと思っていませんか?   この記事では、htmlの中にjavascriptを 書いて、j …

no image

javascriptをhtml内で使う方法「完全初心者向け」

どうもチャーさん(@chaa___san)です。   あなたはjavascriptをhtmlで使えないのか? と疑問に思っていませんか?   結論からいうと使えます。   …

no image

javascriptでランダムに画像を表示する方法「コードコピペOKです」

どうも、チャーさんです。   あなたはjavascriptでランダムに画像を、 表示させたいですか?     この記事ではjavascriptでランダムに画像を、 表示さ …

no image

javascriptでalert(アラート)を表示させる方法

どうも、チャーさんです。   あなたは、javascriptでalert(アラート)を、 表示させたいと思っていませんか?   この記事では、javascriptを使って、 ale …

no image

javascriptでランダムな整数を表示するコードと仕組み解説「コピペOK」

どうも、チャーさんです。   あなたはjavascriptでランダムな整数を、 表示したいですか?   この記事では、javascriptでランダムな整数を、 表示するコードと、そ …

no image

getElementByIdの意味や使い方をわかりやすく紹介します。

  どうも、チャーさんです。   あなたはgetElementByIdの意味はなんだろう? と思ってませんか?   この記事では、getElementByIdの意味や、 …

no image

javascriptでボタンを押したら色が変更できる方法「コード例つき」

どうも、チャーさんです。   あなたはjavascriptで、ボタンを押したら、 色が変更できる方法を探していませんか?   この記事では、ボタンクリックで、 色を変更する方法、コ …

no image

二重ループをjavascriptでする方法

  どうも、チャーさん(@chaa___san)です。   あなたはjavascriptで二重ループを するにはどう書けばいいのか、 と思っていませんか?   この記事で …

no image

javascriptでcssを操作する手順と方法

どうも、チャーさんです。   あなたはjavascriptでcssを操作したい。 そう思っていませんか?   この記事では、javascriptを使って、 cssを操作する方法を書 …

no image

javascriptでボタンをクリックしたらアラートが表示されるコード

どうも、チャーさんです。   あなたはjavascriptでボタンをクリックしたら、 アラートが表示される方法とコードを、 探していますか?     この記事では、ボタン …

no image

javascriptをコンソールで実行する方法

どうも、チャーさんです。   あなたはjavascriptを今すぐに実行できる、 そんな方法を探していますか?   コンソールという機能を使えばそれは、 可能でして、この記事ではコ …

最新記事

チャーさん

プログラミング・筋トレ・unity系の記事などを書いてます。

大学卒業後→開業→個人事業主7年目ぐらいです。webサイト制作したり、unityでゲーム開発しております。

youtubeもやってまして、主にプログラミング動画とかunity系の動画をあげてるので見てください。