JavaScriptについて分からない部分があるので解説をお願いします

Question

http://one-text.tk/template3/
現在上記サイトを制作しています。

レスポンシブメニューのJSで以下の記述が何をしているのかわからないので教えてください。

		$: function(id){
			return document.getElementById(id);
		},

		add: function(elm,listener,fn){
			try { elm.addEventListener(listener,fn,false);}
			catch(e){ elm.attachEvent("on"+listener,fn);}
		}

ご回答よろしくお願いします。

Answer 1

簡潔にコードを書く（ショートカットする）ためのユーティリティー関数と思われます。

それぞれ
document.getElementById('SlideNav')をlib.$('SlideNav')と書けるように、

var listener = "click";
var fn = function(){ /* */ };
try { elm.addEventListener(listener,fn,false);}
catch(e){ elm.attachEvent("on"+listener,fn);}

を

var fn = function(){ /* */ };
lib.add(elm,"click",fn)

と書けるようにしているのだと思います。

(2015-01-31: イベント名を修正 onclick -> click）

Comments

[Cf_cwd]

var listener = "onclick";
は
var listener = "click";
ではないですかね？
本題ではないですし揚げ足を取るような感じがして申し訳ないのですが……

[argius]

Cf_cwdさん
おっしゃるとおりです。訂正しました。

揚げ足では無いですよ。後で読んだ人が誤って理解してしまうのは良くないと思いますので、誤りはできるだけ直したいと思っています。
ご指摘ありがとうございます。