談?wù)別ncodeURI和encodeURIComponent以及escape的區(qū)別與應(yīng)用
首先,我們都知道這三個東西都是用來編碼的先來說encodeURI()和encodeURIComponent(),這兩個是在轉(zhuǎn)換url時候用來編碼解碼用的。
有編碼就會有解碼,解碼就是decodeURI()和decodeURIComponent(),他們的用法很簡單,在參數(shù)中帶入要轉(zhuǎn)碼的文字就可實現(xiàn)目的
如:
encodeURI("我是要編碼的文字")
decodeURI("我是要解碼的文字")
encodeURIComponent("我是要編碼的文字")
decodeURIComponent("我是要解碼的文字")
而encodeURI()和encodeURIComponent()的區(qū)別其實并不大
主要區(qū)別在于:
encodeURI不編碼字符有82個:!,#,$,&,',(,),*,+,,,-,.,/,:,;,=,?,@,_,~,0-9,a-z,A-Z
encodeURIComponent不編碼字符有71個:!, ',(,),*,-,.,_,~,0-9,a-z,A-Z
encodeURI主要用于直接賦值給地址欄時候:
location.href=encodeURI("
而encodeURIComponent主要用于url的query參數(shù): location.); 而escape,相比于上面那兩個,就有所不同了 escape()是編碼,unescape()是解碼; escape 方法 對 String 對象編碼以便它們能在所有計算機(jī)上可讀, escape(charString) 必選項 charstring 參數(shù)是要編碼的任意 String 對象或文字。 說明 escape 方法返回一個包含了 charstring 內(nèi)容的字符串值( Unicode 格式)。所有空格、標(biāo)點、重音符號以及其他非 ASCII 字符都用 %xx 編碼代替, 其中 xx 等于表示該字符的十六進(jìn)制數(shù)。例如,空格返回的是 "%20" 。 字符值大于 255 的以 %uxxxx 格式存儲。 escape不編碼字符有69個:*,+,-,.,/,@,_,0-9,a-z,A-Z 注意 escape 方法不能夠用來對統(tǒng)一資源標(biāo)示碼 (URI) 進(jìn)行編碼。對其編碼應(yīng)使用 encodeURI 和encodeURIComponent 方法。 最后上一段關(guān)于編碼解碼的demo 總結(jié) escape()不能直接用于URL編碼,它的真正作用是返回一個字符的Unicode編碼值。比如"春節(jié)"的返回結(jié)果是%u6625%u8282,,escape()不對"+"編碼 主要用于漢字編碼,現(xiàn)在已經(jīng)不提倡使用。 encodeURI()是Javascript中真正用來對URL編碼的函數(shù)。 編碼整個url地址,但對特殊含義的符號"; / ? : @ & = + $ , #",也不進(jìn)行編碼。對應(yīng)的解碼函數(shù)是:decodeURI()。 encodeURIComponent() 能編碼"; / ? : @ & = + $ , #"這些特殊字符。對應(yīng)的解碼函數(shù)是decodeURIComponent()。 假如要傳遞帶&符號的網(wǎng)址,所以用encodeURIComponent()
<!DOCTYPE html>
<html>
<head>
<title>Tezml_編碼解碼測試</title>
<meta charset="utf-8">
<meta name="author" content="Tezml" />
<meta name="copyright" content="Tezml" />
<meta name="description" content="Tezml" />
<script type="text/javascript" src="http://cdn.bootcss.com/jquery/1.11.2/jquery.min.js"></script>
</head>
<body>
<div id="wz1"></div>
<div id="wz2"></div>
<div id="wz3"></div>
<div id="wz4"></div>
<div id="wz5"></div>
<div id="wz6"></div>
<div id="wz7"></div>
<div id="wz8"></div>
<div id="wz9"></div>
<div id="wz10"></div>
<div id="wz11"></div>
<div id="wz12"></div>
</body>
<script type="text/javascript">
var chinese="請叫我中文"
var english="place tall me englash"
var Monster=":#&$/@"
$("#wz1").html(encodeURI(chinese))//編碼 %E8%AF%B7%E5%8F%AB%E6%88%91%E4%B8%AD%E6%96%87
$("#wz2").html(decodeURI(chinese))//解碼 請叫我中文
$("#wz3").html(encodeURI(english))//編碼 place%20tall%20me%20englash
$("#wz4").html(decodeURI(english))//解碼 place tall me englash
$("#wz5").html(encodeURIComponent(Monster))//編碼 %3A%23%26%24%2F%40
$("#wz6").html(encodeURI(Monster))//編碼 :#&$/@
$("#wz7").html(escape(chinese))//編碼 %u8BF7%u53EB%u6211%u4E2D%u6587
$("#wz8").html(escape(english))//編碼 place%20tall%20me%20englash
$("#wz9").html(escape(Monster))//編碼 %3A%23%26%24/@
$("#wz10").html(unescape(chinese))//編碼 請叫我中文
$("#wz11").html(unescape(english))//編碼 place tall me englash
$("#wz12").html(unescape(Monster))//編碼 :#&$/@
</script>
</html>
相關(guān)文章
js監(jiān)聽鼠標(biāo)點擊和鍵盤點擊事件并自動跳轉(zhuǎn)頁面
這篇文章主要介紹了js監(jiān)聽鼠標(biāo)點擊(onmousedown)和鍵盤點擊(onkeydown)事件并自動跳轉(zhuǎn)頁面,很簡單的一個實現(xiàn)2014-09-09Bootstrap導(dǎo)航條鼠標(biāo)懸停下拉菜單
這篇文章主要為大家詳細(xì)介紹了Bootstrap導(dǎo)航條鼠標(biāo)懸停下拉菜單,具有一定的參考價值,感興趣的小伙伴們可以參考一下2017-01-01javascript實現(xiàn)十六進(jìn)制顏色值(HEX)和RGB格式相互轉(zhuǎn)換
這篇文章主要介紹了javascript實現(xiàn)十六進(jìn)制顏色值(HEX)和RGB格式之間的轉(zhuǎn)換,使用正則的方法實現(xiàn)RGB顏色轉(zhuǎn)換為16進(jìn)制,需要的朋友可以參考下2014-06-06???????Rxjs?map,?mergeMap?和?switchMap?的區(qū)別與聯(lián)系
這篇文章主要介紹了???????Rxjs?map,mergeMap和switchMap的區(qū)別與聯(lián)系,map、mergeMap和switchMap是RxJS中的三個主要運(yùn)算符,在SAP?Spartacus開發(fā)中有著廣泛的使用場景2022-07-07