jQuery插件编写笔记

插件的种类:

1.封装对象方法的插件。

2.封装全局函数的插件。

3.选择器插件。

*所有的对象方法都应当附加到jQuery.fn对象上,而所有的全局函数都应当附加到jQuery对象本身上。

*在插件内部,this指向的是当前通过选择器获取的jQuery对象。

*在插件头部先加上一个分号,以免他人的不规范代码给插件带来影响。

*避免在插件内容使用$作为jQuery对象的别名,而应使用完整的jQuery来表示,这样可以避免冲突。也可以用闭包来回避这个问题。

1
2
3
;(function($){
  //这里放代码
})(jQuery);

*$.fn.extend():接受一个类型为Object对象的参数。Object对象的“名/值对”分别代表“函数或方法名/函数主体”。

*$.extend():也可以用来扩展jQuery对象,但它还可以扩展已有的Object对象。

1
2
3
4
5
6
7
8
9
10
$.extend(target,obj1,......[objN])
//用一个或多个其他对象来扩展一个对象,然后返回被扩展的对象。
 
//合并settings对象和options对象
var settings={validate:false,limit:5,name:"foo"};
var options={validate:true,name:"bar"};
var newOptions=$.extend(settings,options);
 
//结果为
newOptions={validate:true,limit:5,name:"bar"};
1
2
3
4
5
6
7
8
9
//$.extend()方法经常被用于设置插件方法的一系列默认参数
function foo(options){
    options=$.extend({
        name:"bar",
        length:5,
        dataType:"xml"
    },options);
};
//如果用户调用foo()方法的时候,传递的参数options对象中设置了相应的值,那么就使用设置的值,否则使用默认值。
1
2
3
4
5
6
7
8
9
10
11
//用实用函数$.extend()将传递到options参数的值与默认值合并
//也可以使用options自身来存储这个值,而不是创建一个新的settings变量。
function complex(p1,options){
    var settings=$.extend({
        option1:defaultValue1,
        option2:defaultValue2,   
        option3:defaultValue3,   
        option4:defaultValue4,   
        option5:defaultValue5
    },options||{});    //{}是一个空对象,使用||{}来防止options对象是null或undefined,如果options求值为false(null和undefined)则提供一个空对象。
}

jQuery插件编写笔记,古老的榕树,5-wow.com

郑重声明:本站内容如果来自互联网及其他传播媒体,其版权均属原媒体及文章作者所有。转载目的在于传递更多信息及用于网络分享,并不代表本站赞同其观点和对其真实性负责,也不构成任何其他建议。