In depth analysis of the differences and examples of escape of encodeURI of encodeURIComponent of

JavaScript has three functions of the character string coding, respectively is: the escape, encodeURI, encodeURIComponent, three corresponding decoding function: unescape, decodeURI, decodeURIComponent.

Here's a quick look at the differences:

1 The escape () function

Definition and usage

The escape() function encodes the string so that it can be read on all computers.

grammar

The escape (string)

Parameter   describe

String  A necessity. A string to be escaped or encoded.

The return value

A copy of the encoded string. Some of these characters are replaced with hexadecimal escape sequences.

instructions

This method does not encode ASCII letters and Numbers, nor the following ASCII punctuation: - _.! ~ * '(). All other characters are replaced by escape sequences.

2 The encodeURI () function

Definition and usage

The encodeURI() function encodes a string as a URI.

grammar

EncodeURI (URIstring)

Parameter   describe

URIstring  A necessity. A string containing a URI or other text to encode.

The return value

A copy of a URIstring in which certain characters are replaced by hexadecimal escape sequences.

instructions

This method does not encode ASCII letters and Numbers, nor does it encode these ASCII punctuation marks: - _.! ~ * '().

The purpose of this method is to encode the URI completely, so the encodeURI() function does not escape the following ASCII punctuation marks with special meaning in the URI:; / the & # 63; : @ & = + $#

3 EncodeURIComponent () function

Definition and usage

The encodeURIComponent() function encodes a string as a URI component.

grammar

EncodeURIComponent (URIstring)

Parameter   describe

URIstring  A necessity. A string containing a URI component or other text to encode.

The return value

A copy of a URIstring in which certain characters are replaced by hexadecimal escape sequences.

instructions

This method does not encode ASCII letters and Numbers, nor does it encode these ASCII punctuation marks: - _.! ~ * '().

Other characters (e.g. :; / the & # 63; :@&=+$,# these punctuation marks used to separate URI components are replaced by one or more hexadecimal escape sequences.

Hints and comments

Tip: notice the difference between the encodeURIComponent() function and the encodeURI() function, which assumes that its arguments are part of the URI(such as the protocol, hostname, path, or query string). So the encodeURIComponent() function escapes the punctuation used to separate the parts of the URI.

4 Conclusion:

By analyzing the three functions, we know that escape() escapes all incoming strings except ASCII letters, Numbers, and specific symbols, so it's best not to use this method if you want to encode urls. EncodeURI () is used to encode the entire URI, because no valid characters in the URI are encoded. The encodeURIComponent method should be the most commonly used in encoding a single URIComponent (request parameter). It can escape the Chinese and special characters in the parameter without affecting the entire URL.

5 Example:

1 the escape ()

<script type="text/javascript">
document.write(escape("http://www.w3school.com.cn/") + "<br />")
document.write(escape("?!=()#%&"))
</script>

Output:

http%3A//www.w3school.com.cn

%3F%21%3D%28%29%23%25%26

2 encodeURI ()

<script type="text/javascript">
document.write(encodeURI("http://www.w3school.com.cn/")+ "<br />")
document.write(encodeURI("http://www.w3school.com.cn/My first/"))
document.write(encodeURI(",/?:@&=+$#"))
</script>

Output:

http://www.w3school.com.cn/

http://www.w3school.com.cn/My%20first/

,/?:@&=+$#

The entire URL is encoded, and the specific identifier of the URL is not transcoded.

3 encodeURIComponent ()

Case 1:

<script type="text/javascript">
document.write(encodeURIComponent("http://www.w3school.com.cn/"))
document.write("<br />")
document.write(encodeURIComponent("http://www.w3school.com.cn/p 1/"))
document.write("<br />")
document.write(encodeURIComponent(",/?:@&=+$#"))
</script>

Output:

http%3A%2F%2Fwww.w3school.com.cn

http%3A%2F%2Fwww.w3school.com.cn%2Fp%201%2F

%2C%2F%3F%3A%40%26%3D%2B%24%23

Example 2:

<script language="javascript">document.write('
<a href="http://passport.baidu.com/?logout&aid=7&u='+encodeURIComponent(" rel="external nofollow" http://cang.baidu.com/bruce42")+'"> exit </a>');</script>

The parameter in the URL is encoded, because the parameter is also a URL, if not encoded will affect the jump of the entire URL.