JS-13-jquery

来源:互联网 发布:java calendar.gettime 编辑:程序博客网 时间:2024/06/13 12:19

网站:http://james.padolsey.com/jquery

书:

Object Oriented JavaScript

Pro JavaScript Design Patterns

高性能JavaScript

js权威指南


一、架构

(function(){

//暴露外部使用的接口

var jQuery = window.jQuery = window.$ =function(){};

//处理原型对象

jQuery.fn = Query.prototype = {};

//实现继承

jQuery.extend = jQuery.fn.extend =function(){};

//添加静态方法

jQuery.extend(({});

//添加实例方法

jQuery.fn.extend({});

})();

二、数组型对象

方法一:

var o ={};

var arr = [4,5,6];

for(var i=0;i<arr.length;i++){

o[i]=arr[i];

}

o.length = arr.length

方法二:

var divs = document.getElementByTagName("div");

Array.prototype.push.apply(o,divs);

三、初始化

(function(){

//解决冲突

var _$ =window.$;

var _jQuery =  window.jQuery;

//暴露外部使用的接口

var jQuery = window.jQuery = window.$ =function(){

return new jQuery.fn.init(selector);

};

//处理原型对象

jQuery.fn = Query.prototype = {

 init:function(selector){

var elements = document.getElementsByTagName(selector);

Array.prototype.push.apply(this,elements);

return this;

},

jQuery:"1.0.0",

length:0;

size:function(){

return this.length;

}

};

jQuery.fn.init.prototype = jQuery.fn;

//实现继承,只处理只有一个参数,也就是插件的扩展

//jquery 1.参数只有一个的情况2.有多个参数,3深拷贝问题

jQuery.extend = jQuery.fn.extend =function(){

var  o = argumets[0];

for(var p in o){

this[p] = o[p];

}

};

//添加静态方法

jQuery.extend(({

trim:function(text){ //去前后空格

return (text || "").text.replace(/^\s+|\s+$/g,"")

}

noConflick;function(deep){ //解决冲突

window.$=_&;

if(deep){

window.jQuery=_jQuery;

}

return jQuery;

}

});

//添加实例方法

jQuery.fn.extend({

get:function(num){

return this[num].

},

each:funcion(fn){

for(var i=0;i< this.length;i++){

fn(i,this[i]);

}

return this;//支持链式操作

},

css:function(){

var l = arguments.length;

if(l == 1){

return this[0].style[arguments[0]];

}else{

var name = arguments[0];

var value = arguments[1];

this.each(function(index,ele){

ele.style[name] = value;

});

}

return this;//支持链式操作

}

}

});

})();

原创粉丝点击