$.fn.extend簡單學(xué)習(xí)

發(fā)布時間：2020-08-29 21:35:59 來源：網(wǎng)絡(luò) 閱讀：408 作者：韓立偉欄目：web開發(fā)

(function($){
	
	/**
		1.
		$.fn是指jquery的命名空間，加上fn上的方法及屬性，會對jquery實例每一個有效。
		如擴展$.fn.abc(),即$.fn.abc()是對jquery擴展了一個abc方法,
		那么后面你的每一個jquery實例都可以引用這個方法了. 
		那么你可以這樣子：$("#div").abc(); 


		2.  
		jQuery為開發(fā)插件提拱了兩個方法，分別是： 
		
		jQuery.extend(object);為擴展jQuery類本身.為類添加新的方法?！?nbsp;可以理解為【靜態(tài)方法 】
		
		jQuery.fn.extend(object);給jQuery對象添加方法
		jQuery.fn.extend(object);對jQuery.prototype進得擴展，
		就是為jQuery類添加“成員函數(shù)”。jQuery類的實例可以使用這個“成員函數(shù)”。

		//jQuery源碼中。。。
		jQuery.fn = jQuery.prototype ={ 
		　　　init: function( selector, context ){//....　 
		　　　//...... 
		}; 

		
		3.
		$.fn.function用于添加單個方法
		$.fn.extend 用于添加多個方法

		參考：http://www.cnblogs.com/wyjgreat/archive/2011/07/19/2110754.html

	*/

	//1.
	$.fn.abc = function() {
		alert("測試$.fn.,可以參考select下拉框總結(jié)那篇文章！");
	}

	//2.為　jQuery　添加一個為add　的　“靜態(tài)方法”，之后便可以在引入 jQuery　的地方，使用這個方法了，
	$.extend({
		add:function(a,b) {
			return a + b;
		},
		sub:function(a,b) {
			return a - b;
		}
	});

	//2.1
	$.fn.extend({
		getVal:function() {
			return $(this).val();
		}
	});

	//3....
	$.hcCookie = {
		    g: function(name) {
		        var arr = document.cookie.match(new RegExp("(^| )" + name + "=([^;]*)(;|$)"));
		        if (arr != null) return unescape(arr[2]); return null;
		    },

		    d: function(name) {
		        var exp = new Date();
		        exp.setTime(exp.getTime() - 1);
		        var cval = getCookie(name);
		        if (cval != null) document.cookie = name + "=" + cval + ";expires=" + exp.toGMTString() + ";path=/";
		    },

		    s: function(name, value,t) {
		        var days = 30;
		        var exp = new Date();
		        if(t){
		        	exp.setTime(exp.getTime()+t* 60 * 60 * 1000);
		        }else{
		        	exp.setTime(exp.getTime() + days * 24 * 60 * 60 * 1000);
		        }
		        
		        document.cookie = name + "=" + escape(value) + ";expires=" + exp.toGMTString() + ";path=/";
		    }
	};


})(jQuery);


/**
	寫在(function($){})(jQuery);外面
	【下面的代碼可以單獨放在一個JS中，base.js】

*/
var kzCookie={
    g: function(name) {
        var arr = document.cookie.match(new RegExp("(^| )" + name + "=([^;]*)(;|$)"));
        if (arr != null) return unescape(arr[2]); return null;
    },

    d: function(name) {
        var exp = new Date();
        exp.setTime(exp.getTime() - 1);
        var cval = this.g(name);
        if (cval != null) document.cookie = name + "=" + cval + ";expires=" + exp.toGMTString() + ";path=/";
    },

    s: function(name, value,t) {
        var days = 30;
        var exp = new Date();
        if(t){
            exp.setTime(exp.getTime()+t* 60 * 60 * 1000);
        }else{
            exp.setTime(exp.getTime() + days * 24 * 60 * 60 * 1000);
        }
        
        document.cookie = name + "=" + escape(value) + ";expires=" + exp.toGMTString() + ";path=/";
    }
};

//去右空格 
String.prototype.rTrim=function(str){         
   var   re_r=new RegExp("([.\\w]*)"+(str&&("(\\"+str+")")||"[ ]")+"+$") ;
   return   this.replace(re_r, "$1") ;
};
//去左空格 
String.prototype.lTrim=function(str){         
    var   re_l=new RegExp("^"+(str&&("(\\"+str+")")||"[ ]")+"+(.*)") ;
    return   this.replace(re_l, "$2") ;
};
//去左右空格 
String.prototype.trim=function(str){           
   return   this.lTrim(str).rTrim(str) ;
};

測試代碼：

<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
</head>
<body>
	<div>test</div>
	<input type="text" value="hanchao">


	<!-- JS -->
	<script type="text/javascript" src="http://apps.bdimg.com/libs/jquery/2.1.1/jquery.min.js"></script>
	<script type="text/javascript" src="demo.js"></script>
	<script type="text/javascript">
		(function(){
			//alert(1);

			// $("div").abc();

			// var result = $.add(3,4);
			// alert(result);

			//var result = $.sub(5,4);
			//alert(result);

			// var result = $("input").getVal();
			// alert(result);
/*
		 	kzCookie.s("hanchao","testcookienew",24);
		    kzCookie.s("hanchao1","testcookienew1",24);
		     
		    kzCookie.d("hanchao");
		    //kzCookie.d("hanchao1");
		     
		    var cookieValue = kzCookie.g("hanchao");
		    var cookieValue1 = kzCookie.g("hanchao1");
		    alert(cookieValue);
		    alert(cookieValue1);*/

		    $.hcCookie.s("hanchao","testcookienew",24);
		    var cookieValue = kzCookie.g("hanchao");
		    alert(cookieValue);


		})();
	</script>
</body>
</html>

向AI問一下細節(jié)

$.fn.extend簡單學(xué)習(xí)

猜你喜歡

最新資訊

相關(guān)推薦

相關(guān)標(biāo)簽