這是我根據之前遇到的一個面試題,題目:用原生JS實現$("#ct").on("click",fn).attr("id")。
然后看了篇jquery源碼分析(http://www.cnblogs.com/aaronjs/p/3279314.html),自己寫出來的一個實現,選擇器用的querySelector,關於鏈式編程也只是返回this而已,這也算是自己看jquery源碼解決的第一個問題吧,繼續加油。
現在想來當年面試官確實沒說錯,我jquery基礎確實差,慢慢學吧,要學的還在很多。
先上代碼吧。
var jq = function(selector){
return new jq.prototype.init(selector);
};
jq.prototype = {
init:function(selector){
this.el = document.querySelector(selector);
return this;
},
on:function(event,fn){
if(window.addEventListener){
this.el.addEventListener(event,fn,false);
}else if(window.attachEvent){
this.el.attachEvent(on+event,fn);
}
return this;
},
attr:function(event,val){
if(!val){
return this.el.getAttribute(event);
}else{
this.el.setAttribute(event,val);
return this;
}
}
}
jq.prototype.init.prototype = jq.prototype;
console.log(jq("#ct").on("click",function(){alert("您點擊了我。")}).attr("title","我的圖片"));
