首页 > PHP资讯 > HTML5培训技术 > 自己动手Jquery插件

自己动手Jquery插件

HTML5培训技术
最近Web应用程序中越来越多地用到了JQuery等Web前端技术。这些技术框架有效地改善了用户的操作体验,同时也提高了开发人员构造丰富客户 端UI的效率。JQuery本身提供了丰富的操作,但是,有时候我们需要根据我们自己的业务和系统特色(风格)构造一些我们常用的前端UI组件,而 JQuery的插件给了我们一个较好的方式来构造这些UI组件,方便我们日后反复重用这些组件。
 
网上也有很多关于JQuery插件的文章,我也搜了一些,但是,这些文档太过离散,没有有效地组织并充分说明JQuey插件该如何编写,并且有哪几种形式,什么情况下使用哪种形式。下面,我将说明JQuery插件常用的写法,以及这些插件的常用场景。 
 
一、插件的几种写法
 
首先,在具体说明编写插件之前,我们先假定一个使用场景:有一个HTML页面(或. Script库插件混淆。例如命名为jquery.color.js。
 
所有的对象方法都应当附加到jQuery.fn对象上,而所有的全局函数都应当附加到jQuery对象本身上。
 
在插件内部,this指向的是当前通过选择器获取的jQuery对象,而不像一般的方法那样,例如click()方法,内部的this指向的是DOM元素。
 
可以通过this.each来遍历所有元素。
 
所有的方法或函数插件,都应当以分号结尾,否则压缩的时候可能出现问题。为了更稳妥些,甚至可以在插件头部先加上一个分号,以免他人的不规范代码给插件带来影响。具体方法可以参考后面的代码。
 
插件应该返回一个jQuery对象,以保证插件的可链式操作。除非插件需要返回的是一些需要获取的量,例如字符串或者数组等。
 
避免在插件内部使用$作为jQuery对象的别名,而应使用完整的jQuery来表示。这样可以避免冲突。当然,也可以利用闭包这种技巧来回避这个问题,使插件内部继续使用$作为jQuery的别名。很多插件都是这么做的,本教程也会利用这种形式。

HTML5培训技术

本文由欣才IT学院整理发布,未经许可,禁止转载。
支持10不支持0