有学有练才叫学习:学而不思则罔,思而不学则殆:学而不习,纸上谈兵,习而不进,画地为牢!

jquery 插件封装

javascript cat 10个月前 (12-15) 69次浏览 已收录 0个评论 扫描二维码

1、插件

http://plugins.jquery.com

https://www.jq22.com

1、类级插件

// 类级别的插件:扩展$下的方法,如 $.map $.each
; (function ($) {
    $.extend({
        方法名1: function () { },
        方法名2: function () { }
    })
})(jQuery);
// 使用
$.方法名1();
$.方法名2();

2、对象级插件

// 对象级插件:扩展jQuery对象下的方法,如 jQuery对象.css() jQuery对象.html()
; (function ($) {
    $.fn.extend({
        方法名1: function () { },
        方法名2: function () { }
    });
})(jQuery);
// 使用
jQuery对象.方法名1();
jQuery对象.方法名2();

3、插件的基本要点

1、jQuery 插件的文件名推荐命名为 jquery.[插件名].js,以免和其他 javascript 库插件混淆。

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

3、在插件内部,this 指向的是当前通过选择器获取的 jQuery 对象,而不像一般的方法那样,例如 click(),内部的 this 指向的是 DOM 元素。

4、可以通过 this.each 来遍历所有元素。

5、所有的方法或函数插件,都应当以分号结尾,否则压缩的时候可能出现问题,为了更稳妥些,甚至可以在插件头部先加上一个分号,以免他人的不规范代码给插件带来影响。

6、插件应该返回一个 jQuery 对象,以保证插件的可链式操作,除非插件需要返回的是一些需要获取的量,例如字符串或者数组等。

7、避免在插件内部使用$作为 jQuery 对象的别名,而应该使用完整的 jQuery 表示。这样可以避免冲突。当然,也可以利用闭包这种技巧来回避这个问题,使插件内部继续使用$作为 jQuery 的别名。很多插件都是这样做的。

喜欢 (0)
cat
关于作者:
发表我的评论
取消评论
表情 贴图 加粗 删除线 居中 斜体 签到

Hi,您需要填写昵称和邮箱!

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址