JQuery写拓展

基础

$.extend()扩展JQuery静态方法,$.fn.extend()扩展JQuery实例方法
静态方法:

$.extend({
  sayName:function() {
    console.log("My name is JQuery");
  } 
});
$.sayName();  //"My name is JQuery"

实例方法:

$.fn.extend({
  check: function() {
    return this.each(function(){
      this.checked=true;
    });
  }
});
$("input[type='checkbox']").check();   //所有checkbox都会被选择

extend参数

**将src1,src2...srcN的每一项合并为dest,并返回合并后的对象。

extend(dest, src1, src2...srcN);

例子

var dest = {name:"job", age:20}, src1={name:"tom", live:"Beijing"};

$.extend(dest, src1);

console.log(dest);  //{name: "tom", age: 20, live: "Beijing"}

这个方法写插件的时候经常使用

(function($){
  $.fn.extend({
    dralog: function(options) {
      var default = {
        width: 100,
        height: 100
      };

      var style = $.extend({}, default, options);

      console.log(style);

      $("div").css(style);
    }
  });
})(jQuery);
$().dralog({
  width: 200,
  height: 200
});

当extend只有一个参数时

将dest的每一项合并到jquery全局对象中去。

extend(dest);

$.fn.extend(dest)

将dest的每一项合并到JQuery的实例中

$.fn.extend({name:'tom'});

extend的第一参数为boolean值得时候

Boolean为true时为深拷贝,为false时为浅拷贝

extend(Boolean, src1, src2...srcN);

你可能感兴趣的:(JQuery写拓展)