首页技术正文

encodeURI和uncodeURIComponent的介绍

开发者沐言技术 2022年11月15日

0 收藏 683 点赞 3,386 浏览 1347 个字

encodeURI、decodeURI

encodeURI、decodeURI 对字符转义；不替换特殊字符有18个、(大小写)字母、数字。

替换目标

将字符替换为 HTML URL编码

替换范围

A-Z a-z 0-9 – _ . ! ~ * ‘ ( ) / ? : @ & = + $ # 不替换，其他都替换。

encodeURI("ABC abc 123")     //ABC%20abc%20123
decodeURI("ABC%20abc%20123") //ABC abc 123

encodeURIComponent、decodeURIComponent：

对特殊字符转码，

　　　　替换范围： A-Z a-z 0-9 – _ . ! ~ * ‘ ( ) 不替换，其他都替换。

var set1 = ";,/?:@&=+$";
var set2 = "-_.!~*'()";
var set3 = "#";
var set4 = "ABC abc 123";console.log(encodeURIComponent(set1)); //%3B%2C%2F%3F%3A%40%26%3D%2B%24
console.log(encodeURIComponent(set2)); // -_.!~*'()
console.log(encodeURIComponent(set3)); // %23
console.log(encodeURIComponent(set4)); // ABC%20abc%20123 (the space gets encoded as %20)

encodeURIComponent和encodeURI的区别

　　范围区别：encodeURIComponent的替换字符 > encodeURI的替换字符

　　1.encodeURIComponent会替换： / ? : @ & = + $ #

　　2.encdoeURI不会替换： / ? : @ & = + $ #

var set1 = ";,/?:@&=+$";  // Reserved Characters
var set2 = "-_.!~*'()";   // Unescaped Characters
var set3 = "#";           // Number Sign
var set4 = "ABC abc 123"; // Alphanumeric Characters + Spaceconsole.log(encodeURI(set1)); // ;,/?:@&=+$
console.log(encodeURI(set2)); // -_.!~*'()
console.log(encodeURI(set3)); // #
console.log(encodeURI(set4)); // ABC%20abc%20123 (the space gets encoded as %20)console.log(encodeURIComponent(set1)); // %3B%2C%2F%3F%3A%40%26%3D%2B%24
console.log(encodeURIComponent(set2)); // -_.!~*'()
console.log(encodeURIComponent(set3)); // %23
console.log(encodeURIComponent(set4)); // ABC%20abc%20123 (the space gets encoded as %20)