淺談encodeURI和encodeURIComponent

encodeURI 區別於 encodeURIComponent

對URL編碼是常見的事，因此這兩個方法應該是實際中要特別注意的。
它們都是編碼URL，惟一區別就是編碼的字符範圍，其中

1. encodeURI方法不會對下列字符編碼:
   ASCII字母、數字、~!@#$&*()=:/,;?+'
2. encodeURIComponent方法不會對下列字符編碼:
   ASCII字母、數字、~!*()'

因此encodeURIComponent比encodeURI編碼的範圍更大。
實際例子來講，encodeURIComponent會把 http:// 編碼成 http%3A%2F%2F 而encodeURI卻不會。

兩者應用場景

若是你須要編碼整個URL，而後須要使用這個URL，那麼用encodeURI;

好比：
encodeURI("http://www.cnblogs.com/season-huang/some other thing");
編碼後會變爲:
"http://www.cnblogs.com/season-huang/some%20other%20thing";
其中，空格被編碼成了%20。可是若是你用了encodeURIComponent，那麼結果變爲:
"http%3A%2F%2Fwww.cnblogs.com%2Fseason-huang%2Fsome%20other%20thing"

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

當你須要編碼URL中的參數的時候，那麼encodeURIComponent是最好方法。

var param = "http://www.cnblogs.com/season-huang/"; //param爲參數
param = encodeURIComponent(param);
var url = "http://www.cnblogs.com?next=" + param;
console.log(url) //"http://www.cnblogs.com?next=http%3A%2F%2Fwww.cnblogs.com%2Fseason-huang%2F"

看到了把，參數中的 "/" 能夠編碼，若是用encodeURI確定要出問題，由於後面的/是須要編碼的。