attachEventとonclickのthis

今更IE8情報。

概要

ある要素にイベントを付けたい場合、いくつも要素がある時は親要素にイベントをつけたほうが良い、と言われている。
イベントオブジェクト - JavaScript初級者から中級者になろう

しかしattachEventではそのイベントを付けた親要素自身を参照できないようだ。その場合parentNodeを辿るしかない。（尤もそのような時はなかなかないと思うけれど）

例

ul>li というHTMLがあるとき。
ulにイベントをつけてliをクリックすると、どのエレメントが参照されるか。

IE8

method	e	e.srcElement	window.event.srcElement	this
onclick	-	-	li	ul
attachEvent	Event	li	li	window

IE9

method	e	e.srcElement	window.event.srcElement	this
onclick	MouseEvent	li	li	ul
attachEvent	MSEventObj	li	li	window
addEventLis*1	MouseEvent	li	li	ul

*1 addEventListenerではevent.currentTargetからもULを参照できる。

表からわかること

• IE8ではonclick時にイベントが渡されない
• attachEventではulを参照できない
• e.srcElementは要らない…?

備考

1. onclickは次の形で、無名関数では無い
   ○ li.onclick = fn
   × li.onclick = function(){ fn() }
2. 確認用のコードは gistsに