「初めてのJavaScript 第2版」 7章までの復習メモ

前回は、イマイチ理解できていなかったので復習。
さっき気付いたら電気を付けたまま寝てしまっていたのでメモだけ。

復習

再度読んで重要だと思った箇所。

・デバッグコードの例

P120
console.log("わたしの名前は %s で %d 歳です。", myName, myAge);

・オブジェクト検出はP131-P132の例と、12章で。
・イベントと関連するオブジェクトの一覧はP136に。

・入れ子のdivで同時にイベントを満たした場合は、内側実行→外側実行の順番。

P143から一部抜粋

document.getElementById("outer").onmousedown = （略） 
document.getElementById("inner").onmousedown = （略） //こちらが先に実行される

<div id="outer">
 <div id="inner">
 </div>
</div>

・途中で（例えば上記の例なら内側で）処理を中断するには以下を入れる。

P145から一部抜粋

if(event.stopPropagation){
 event.stopPropagation();
}else{
 event.cancelBubble = true;
}

stopPropagationオブジェクトが存在する場合はそれを使う。
存在しない（IEの)場合はcancelBubbleをtrueとする。
なお、if(cancelBubble)と条件を逆にするのは間違い。
理由は、cancelBubbleが存在し、かつfalseの場合に誤動作するため。

・DOMレベル2のイベントリスナーは、各オブジェクトにイベントハンドラをadd/removeできる。
・各ブラウザ（DOMレベル2対応、IE、DOM0のみ対応）に対応したコードは以下のように書く。綺麗な例だと思う。

P151から一部抜粋

formObj = document.getElementBiId("form1");
if(formObj.addEventListener){　//addEventLustenerメソッドが存在するか判断。
 IsDomLevel2 = true;
 IsIE = false;
}
else if(formObj.attachEvent){　//attachEventメソッドが存在するか判断。
 IsDomLevel2 = false;
 IsIE = true;
}
else{
 IsDomLevel = IsIE = false;
}

if(IsDomLevel2){
//DOMレベル2用コードを書く
}
else if(IE){
//IE用コードを書く
}
else{
//DOMレベル0用コードを書く
}

前回読んだときはぼんやりとしか分からなかったけど今日で解決。
JavaScriptはおもしろい。