创建自己的 jQuery 插件 (1)

jQuery 无处不在: 很少人会在制作需要 javaScript 的页面是不使用它( AngularJS 内含 jQuery Lite)。本文将会一步一步的介绍如何创建一个 jQuery 小插件。

jQuery 也有不断在增长的无数的插件/扩展,这些插件/扩展基于 jQuery 实现了自己的逻辑,或者表现,但并不应你能找到一个适合于你的项目使用的兼顾性能与表现的插件/扩展,当然了,前提是你的顾客重视性能和表现的话。

 

创建环境

测试代码需要有测试环境,幸好,我在这儿说的仅仅是 jQuery , 所以,一个浏览器就足够了,但是你至少要使用任何你喜欢的方式建立一个项目目录,目录下最好有是这样的:

或者,你不想在你的电脑上存放 jQuery ,你可以从任何一家jQuery CDN服务商那里复制一个链接过来,如果你真想这样,推荐使用BootCDN

防止$冲突

jQuery 并不是唯一一个占用 $ 的库,所以需要考虑下避免冲突:

 

添加变量与函数

闭包可以让我们在“私有”的工作空间里写变量、函数以及其它代码。我们现在将添加一个变量(用于存储文本内容)和一个打开一个警告窗口的函数:

 

公开/暴露一些内容

既然是被调用的,我们就该暴露一些成员给调用者,应使用 jQuery 的 fn 对象来实现。fn 和其它对象的行为是类似的: 你可以添加方法和变量,就像下面这样:

 

避免 $ 阻塞

为了防止潜在的 $ 阻塞,我们需要再进行下处理:

 

 

尝试调用

进一步完善后的 my-plugin.js :
这个插件是可用的,但是它还不算好,至少它目前为止,还不支持链式写法,在下一篇 《创建自己的 jQuery 插件 (2)》 将会介绍如何写出更完善的插件。

完善文档

当你想让自己的插件被其它开发者使用时,应有完善的文档,不赘述。

登录 NPM

jQuery 的插件库已由 GitHub 转成更现代的 NPM 架构,添加NPM 用户:

然后输入用户名和密码即可。
注意:你的密码保存在 NPM 的服务器上,可以通过这个链接重置密码.

创建一个 manifest 文件

 

推送代码

上传成功后,可以通过 NPMjs.com/package/PACKAGE_ID  这样的链接查看自己的包。

关于版本

还是看 查看这里 吧!


error: 错误信息!