大前端

jquery编写插件的方法-类级别开发插件

2019-04-29  本文已影响0人  欢乐时光欢乐你我

类级别的静态开发就是给jquery添加静态方法,三种方式

1.添加新的全局函数

2.使用$.extend(obj)

3.使用命名空间

类级别开发插件(用的非常少)

分别举例:

1.直接给jquer添加全局函数


jQuery.myAlert=function (str) {
    alert(str);
}; 

2.用extend()方法。extend是jquery提供的一个方法,把多个对象合并起来,参数是object

jQuery.extend({
    myAlert2:function (str1) {
        alert(str1);
    },
    myAlert3:function () {
        alert(11111);
    }
}); 
//一定要注意两种类级别编写插件方式书写的区别。

3.使用命名空间(如果不使用命名空间容易和其他引入的JS库里面的同名方法冲突)

jQuery.xs={
    myAlert4:function (str) {
        alert(str);
    },
    centerWindow:function (obj) {
        obj.css({ 'top':($(window).height()-obj.height())/2,
            'left':($(window).width()-obj.width())/2
         }); //必须进行返回对象的操作,否则就不能继续往下进行链式操作了。。
        return obj;
    }
};

调用部分:

 //调用自定义插件方法
  $('#btn').click(function () {
      $.myAlert('我是调用jquery编写的插件弹出的警告框');
      $.myAlert2('我是调用jquery的extend()方法编写的插件弹出的警告框');
      $.myAlert3();
      $.xs.myAlert4("调用使用了命名空间编写的插件方法");
  });
 $.xs.centerWindow($('#div1')).css('background','red');</pre>



注意:jquery文件要一并引入。
上一篇 下一篇

猜你喜欢

热点阅读