JS问题整理与思考--模拟jQuery的原型
- 1.创建jQuery方法
- 2.jQuery方法返回jQuery.fn.init的实例
- 3.构造函数jQuery.fn.init的方法
- 4.jQuery.fn.init的原型指向jQuery.fn
- 5.jQuery.fn 创建操作方法
(function (window) {
var jQuery = function (selector) {
return new jQuery.fn.init(selector)
}
jQuery.fn = {
css:function (key, value) {
alert('css')
}
}
var init = jQuery.fn.init = function(selector) {
var slice = Array.prototype.slice
var dom = slice.call(document.querySelectorAll(selector))
var i,len = dom ? dom.length : 0
for(i=0;i < len;i++){
this[i] = dom[i]
}
this.length = len
this.selector = selector
}
init.prototype = jQuery.fn
window.$ = jQuery
})(window)
为什么要多存在一步jQuery.fn?
- 只有$会暴露在window全局变量,init方法并不能直接在全局访问。
- 将插件扩展统一到$.fn.xxx这一个接口方便使用
推荐文章