jQuery plugin简单理解

jQuery不得不说是一个越用越喜爱的js框架,好处就太多了,google一下一大把,而jQuery自身提供的方法是有限的,对于要完成一个特定的复杂功能,就要自己去编写一些插件,对于这些插件具有高度的独立性和可复用性,在项目开发总可以节省大量的时间和精力,下面就把我学习jQuery Plugin的一些笔记分享给大家,如有写错的地方大家可要不吝赐教。


一、搭建jQueryPlugin最简单的骨架,在jQuery的prototype上增加函数($.fn==$.prototype),下面的写法也算是固定写法

jQuery.fn.myPlugin = function() {     // Do your awesome plugin stuff here    }  

二、上面已经完成了jQueryPlugin最基本的骨架,在里面写一些自己的逻辑就可以实现一些功能,但这还没完,对于引入多个插件就会有与其他插件发生命名冲突的危险,虽然几率很小,如果遇上了也是很麻烦的,这一节就是将jQueryPlugin放在一个自己执行的范围内,避免与其他js函数发生冲突,用到的方法是js的闭包(closure,具体闭包也理解的不太清楚,指导的大牛可以给点指点哈),所以对于上面的插件代码就可以在进行优化一下

<scripttype="text/javascript">       // usejs closure        (function($){           $.fn.myPlugin=function(){               // add a plugin code            };       })(jQuery);   </script>  

三、插件执行的上下文(Context)就是自己所写插件的执行范围,个人理解就是$.fn.myPlugin=function(){}这个函数的执行范围,在这个函数执行范围中this关键字是指向jQuery对象的,所以this关键字可以直接引用jQuery的方法,不必使用$(this)进行包装

<scripttype="text/javascript">       // use js closure        (function($){           $.fn.myPlugin=function(){               // find方法没有报错说明是一个jQuery的对象                var root = this.find(‘root’) ;           };       })(jQuery);   </script>  

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:https://www.heiqu.com/wyxwgx.html