chrome で java script デバッグ
chromeを開いている状態で
Ctrl + Shift + i
でDeveloper Tools を起動できるので
今回は
その中にある
Sourceタブを使って
java script のデバッグ
今回の実践に使わせてもらったのは
http://dotinstall.com/lessons/basic_chrome_dev/7107
の動画
そして
実際にデバッグを行うのは
http://samples.dotinstall.com/basic_chrome_dev/7102/
です
動画を見ながら実際におこなうことができるので
実戦形式で覚えることができます
以下は、実際にやったときのメモ
java script でエラーが起きているときには
developer tools の画面の一番右下に
エラーの個数がでるのでそれをクリックすれば
エラーが表示されます
scriptタグの中の java script は編集できるので
修正し、保存します
保存とはいっても一時保存みたいなもので
実際のソースコードそのものは保存はされません
とりあえず
document.getElementbyId(‘result’).innerHTML = omikuji;
を
document.getElementById(‘result’).innerHTML = omikuji;
に編集したら
Ctrl +s で保存して
ブラウザで
おみくじをひく
をクリックすれば
あなたの今日の運勢は大吉！！！！！
というように
反応するようになります
ちなみに、編集前は
あなたの今日の運勢は…！
のまま変わりません
実際にソースを書き換えたのを保存したいなら
右クリックして
Save As
を選択して保存するようにします
また
Cmd+L:行番号でジャンプ
Cmd+O:ファイルの一覧を表示
Cmd+Shift+O:関数やセレクタの一覧を表示
というショートカットキーですが
ubuntu の場合なら
Cmd ではなく Ctrl キーとなります