本文共 4685 字,大约阅读时间需要 15 分钟。
自定义主要通过两种方式实现
$.extend({aa:function(){}}); $.fn.extend({aa:function(){}}); 调用的方法分别是: $.aa(); $($this).aa(); 注意: 创建函数时不要放在 $(function() { }中,调用时候要放在事件里面 $($this).click(function(){$.aa();});jQuery.extend 函数详解 JQuery的extend扩展方法:
Jquery的扩展方法extend是我们在写插件的过程中常用的方法,该方法有一些重载原型,在此,我们一起去了解了解。 一、Jquery的扩展方法原型是:var result=$.extend({},{name:"Tom",age:21},{name:"Jerry",sex:"Boy"})
那么合并后的结果
result={name:"Jerry",age:21,sex:"Boy"}
也就是说后面的参数如果和前面的参数存在相同的名称,那么后面的会覆盖前面的参数值。
二、省略dest参数
上述的extend方法原型中的dest参数是可以省略的,如果省略了,则该方法就只能有一个src参数,而且是将该src合并到调用extend方法的对象中去,如: 1、$.extend(src) 该方法就是将src合并到jquery的全局对象中去,如:下面例举几个常用的扩展实例:
这是在jquery全局对象中扩展一个net命名空间。
三、Jquery的extend方法还有一个重载原型:
第一个参数boolean代表是否进行深度拷贝,其余参数和前面介绍的一致,什么叫深层拷贝,我们看一个例子:
以上就是$.extend()在项目中经常会使用到的一些细节。
#################################################################################################################
这里简要地进行些写法,主要是简写的说明,见下列代码:
<script type="text/javascript" src="jquery-1.4.2.js"></script>
<script type="text/javascript"> //jQuery插件的写法(需要传入操作对象) ;(function($) { //PI_TestPlugIn为插件名称,也是插件的操作对象 //为了不会与其它插件名重复,这里我使用PlugIn的缩写PI_来定义插件对象前缀 $.fn.PI_TestPlugIn= { //该插件的基本信息 Info:{ Name: "TestPlugIn", Ver: "1.0.0.0", Corp: "Lzhdim", Author: "lzhdim", Date: "2010-01-01 08:00:00", Copyright: "Copyright @ 2000-2010 Lzhdim Technology Software All Rights Reserved", License: "GPL" }, //具有参数的函数对象,这里参数是一个对象,具有属性 FunctionWithParams:function(paramObj) { //使用参数,是否使用默认值 var params = paramObj ? paramObj : new function(){ param1= "1"; param2= "2"; }; return this.Info.Name + ".FunctionWithParamObject"; }, //具有参数的函数对象,这里参数是一个变量 FunctionWithParam:function(varparam) { //使用参数,是否使用默认值 var param = varparam ? varparam : null; return this.Info.Name + ".FunctionWithParam"; }, //不具有参数的函数对象 FunctionWithOutParam:function() { return this.Info.Name + ".FunctionWithOutParam"; } }; })(jQuery); //jQuery拓展函数的写法(不需要传入操作对象),即API函数 ;(function($) { $.extend({ //PIF_TestExtendFunction为拓展函数的操作对象 //为了不会与其它插件名重复,这里我使用PlugIn的缩写PI_来定义插件对象前缀 PIF_TestExtendFunction: { //该拓展函数的基本信息 Info:{ Name: "TestExtendFunction", Ver: "1.0.0.0", Corp: "Lzhdim", Author: "lzhdim", Date: "2010-01-01 08:00:00", Copyright: "Copyright @ 2000-2010 Lzhdim Technology Software All Rights Reserved", License: "GPL" }, //具有参数的函数对象 FunctionWithParams:function(paramObj) { //使用参数,是否使用默认值 var params = paramObj ? paramObj : { param1: "1", param2: "2" }; return this.Info.Name + ".FunctionWithParamObect"; }, //具有参数的函数对象,这里参数是一个变量 FunctionWithParam: function (varparam) { //使用参数,是否使用默认值 var param = varparam ? varparam : null; return this.Info.Name + ".FunctionWithParam"; }, //不具有参数的函数对象 FunctionWithOutParam:function() { return this.Info.Name + ".FunctionWithOutParam"; } } }); })(jQuery); $(function () { //测试插件 var params = { param1: "3", param2: "4" }; alert($(this).PI_TestPlugIn.FunctionWithParams(params)); alert($.PIF_TestExtendFunction.FunctionWithOutParam()); }); </script>#########################################################################################
jquery闭包写法:
一般jQuery的代码通常会包含在如下代码之间
(function( $ ){ //code here})( jQuery );
这个是啥意思呢?
相当于
//定义一个函数 $为参数名foo = function($){}//把jQuery参数传递进函数内部 执行这个函数, 这样函数内部就可以使用$这个内部变量代替jQuery变量了foo(jQuery);
这样做的好处是把jQuery传入函数内部,$为函数内的局部变量,不会与其他js程序和框架产生冲突
转载地址:http://pjebi.baihongyu.com/