と思っていた。
同じことをややこしく書いてるのがaddEventListenerぢゃね？と思っていた。
flasherのひとが慣れ親しんだ関数名つけて処理してんじゃね？と思っていた。

hoge.onclick = ～
hoge.addEventListener(click,~,false);

けど違うらしい。

Step 8: DOM のイベントモデル — addEventListener()
実はいままで扱ってきた .onclick = のようなプロパティというのは，イベント処理機構の一面しか示していません。内的には，より柔軟なイベント管理メカニズムが存在しています。

そのイベント管理メカニズムを通してイベントを登録する関数が element.addEventListener() です。

addEventListener() は，「イベントハンドラの差し替え」は行いません。「イベントハンドラの追加」を行うだけです。この例だと，ボタンを押すと ChangeBGColor() と ChangeFGColor() の両者が呼ばれます。

http://d.hatena.ne.jp/dayflower/20080516/1210917670

onclickはその中に書かれている内容だけを処理する
（→一個書いたらそれでおしまい　あとからまたonclickが追加されたら上書きされちゃう）
addEventListenerはイベントハンドラを指定してそのイベントが起こった時に処理する内容を追加していく
（→他の人が後からコードいじいじして処理を追加したいときとかに上書きされちゃうのを防げる）
ってことかしら。

ふ～ん。出来る事が違うお二人なのですね。
失礼しましたaddEventListenerさん。

もじらさんとこにも同じ内容書いていたのですがわたしクレバーな脳みそはあいにくもちあわせてないので、
最初読んだときは意味不でした。上のリンクの内容めっけてやっとわかった。

↓もじらさんとこ↓

イベントリスナーを登録するための古い方法

addEventListener() は、DOM 2 Events 仕様で導入されました。それ以前は、イベントリスナーを以下のように登録していました。

// 関数へのリファレンスを利用する方法—'()’ が無いことに注意していください
el.onclick = modifyText;
// 関数式を利用する方法
element.onclick = function(){
…文…
};
このメソッドは、要素上に click イベントリスナーが既に存在する場合、それを置き換えます。他のイベント、blur (onblur)、keypress (onkeypress)、などのような関連するイベントハンドラも同様です。

これは、本質的には、DOM 0 の一部分なので、この方法は、非常に広くサポートされており、特別なクロスブラウザコードも必要ありません。それ故、addEventListener() の独自の機能が必要でない場合に、動的にイベントリスナーを登録する方法として普通に使われています。

https://developer.mozilla.org/ja/DOM/element.addEventListener#.e3.82.a4.e3.83.99.e3.83.b3.e3.83.88.e3.83.aa.e3.82.b9.e3.83.8a.e3.83.bc.e3.82.92.e7.99.bb.e9.8c.b2.e3.81.99.e3.82.8b.e3.81.9f.e3.82.81.e3.81.ae.e5.8f.a4.e3.81.84.e6.96.b9.e6.b3.95

addEventListenerみたいにIEのおばかさんは処理分岐させないと動かないってことがないので
onclickは古い指定方法だけどバンバン使われているよってことか。

ふ～ん
ためになりました