jquery扩展

当重复使用某个方法时,你就会想要封装这些代码,即使在客户端编写js或者jquery脚本也不另外。恰巧在项目中使用到了jquery对于方法封装的好处,非常灵活。

1.类级扩展-全局方法

//自定义全局函数1 未用命名空間
 jQuery.extend({
   sum:function(a,b){return a+b;}
 });
 // 自定义全局函数2
 jQuery.foo=function(j){
 	alert(j);
 }
 //自定义全局函数1 用命名空間
 jQuery.myPlugin={
 	foo:function(j){
 		alert(j);
 	}	
 }

2.对象方法的扩展

(function($){
 	//形式1
 	$.fn.extend({
 		add:function(j){
 			alert(j);
 		}
 	});
 	//形式2
 	$.fn.foo=function(j){
 		alert(j);
 	}
 })(jQuery);

ps: 上面定义了一个jQuery函数,形参是$,函数定义完成之后,把jQuery这个实参传递进去.立即调用执行。这样的好处是,我们在写jQuery插件时,也可以使用$这个别名, 而不会与prototype引起冲突.

3.页面调用

<body>
 	<a href="#" id="a">click</a>
 </body>
 <script type="text/javascript">
 	$("#a").click(function(){
 		$("#a").add(2);
 		$("#a").foo(3);
 		$.foo("foo1");
 		$.myPlugin.foo("foo2");
 		return false;
 	});
 </script>

ps:这里也遇到一个不解,当类级别的代码和对象级别的代码放在同一个js文件中时,会产生错误,分开则表示正常。

你可能感兴趣的:(Jquery扩展,对象级别,类级别)