首頁 > web前端 > js教程 > 主體

簡單明了區分escape、encodeURI和encodeURIComponent

青灯夜游
發布: 2018-10-08 16:05:04
轉載
1717 人瀏覽過

這篇文章主要介紹了escape、encodeURI和encodeURIComponent的區別,需要的朋友可以參考下

一、前言

講這3個方法區別的文章太多了,但是大部分寫的都很繞。本文試著從實務角度去講這3個方法。

二、escape和它們不是同一類別

簡單來說,escape是對字串(string)進行編碼(而另外兩種是對URL),作用是讓它們在所有電腦上可讀。
編碼之後的效果是%XX或%uXXXX這種形式。
其中 ASCII字母、數字、@*/ ,這幾個字元不會被編碼,其餘的都會。
最關鍵的是,當你需要對URL編碼時,請忘記這個方法,這個方法是針對字串使用的,不適用於URL。
事實上,這個方法我還沒有在實際工作中用過,所以就不多講了。

三、最常用的encodeURI和encodeURIComponent

對URL編碼是常見的事,所以這兩個方法應該是實際中要特別注意的。
它們都是編碼URL,唯一差異就是編碼的字元範圍,其中
encodeURI方法不會對下列字元編碼  ASCII字母、數字、~!@#$&*()=:/,;? '
encodeURIComponent方法不會對下列字元編碼ASCII字母、數字、~!*()'
所以encodeURIComponent比encodeURI編碼的範圍更大。
實際例子來說,encodeURIComponent會把 http://  編碼成  http:// 而encodeURI卻不會。

四、最重要的,我該什麼場合用什麼方法

區別上面說的很清楚了,接下來從實際例子來說把。

1、如果只是編碼字串,不和URL有半毛錢關係,那就用escape。
2、如果你需要編碼整個URL,然後需要使用這個URL,那就用encodeURI。

例如

encodeURI("//www.php.cn/season-huang/some other thing");
登入後複製

編碼後會變成

"//www.www.php.cn/season-huang/some%20other%20thing";
登入後複製

其中,空格編碼就變成了 。但如果你用了encodeURIComponent,那麼結果變成:

"http://www.jb51.net/season-huang/some other thing"

看到了區別嗎,連" /" 都被編碼了,整個URL已經沒辦法用了。  

3、當你需要編碼URL中的參數的時候,那麼encodeURIComponent是最好方法。

var param = "//www.php.cn/season-huang/"; //param为参数
param = encodeURIComponent(param);
var url = "//www.php.cn?next=" + param;
console.log(url) ////www.php.cn?next=http%3A%2F%2Fwww.jb51.net%2Fseason-huang%2F
登入後複製

看到了把,參數中的 "/" 可以編碼,如果用encodeURI肯定要出問題,因為後面的/是需要編碼的。

以上就是本章的全部內容,更多相關教學請訪問JavaScript影片教學

以上是簡單明了區分escape、encodeURI和encodeURIComponent的詳細內容。更多資訊請關注PHP中文網其他相關文章!

相關標籤:
來源:jb51.net
本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn
熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板