escape()、encodeURI()、encodeURIComponent()区别详解

原创 2013年12月03日 16:36:30

JavaScript中有三个可以对字符串编码的函数,分别是: escape,encodeURI,encodeURIComponent,相应3个解码函数:unescape,decodeURI,decodeURIComponent 。

下面简单介绍一下它们的区别

1 escape()函数

定义和用法 
escape() 函数可对字符串进行编码,这样就可以在所有的计算机上读取该字符串。

语法 
escape(string)

参数  描述  
string  必需。要被转义或编码的字符串。 

返回值 
已编码的 string 的副本。其中某些字符被替换成了十六进制的转义序列。

说明 
该方法不会对 ASCII 字母和数字进行编码,也不会对下面这些 ASCII 标点符号进行编码: - _ . ! ~ * ' ( ) 。其他所有的字符都会被转义序列替换。

 


2 encodeURI()函数 
定义和用法 
encodeURI() 函数可把字符串作为 URI 进行编码。

语法 
encodeURI(URIstring)

参数  描述  
URIstring  必需。一个字符串,含有 URI 或其他要编码的文本。 

返回值 
URIstring 的副本,其中的某些字符将被十六进制的转义序列进行替换。

说明 
该方法不会对 ASCII 字母和数字进行编码,也不会对这些 ASCII 标点符号进行编码: - _ . ! ~ * ' ( ) 。

该方法的目的是对 URI 进行完整的编码,因此对以下在 URI 中具有特殊含义的 ASCII 标点符号,encodeURI() 函数是不会进行转义的:;/?:@&=+$,#

 


3 encodeURIComponent() 函数

定义和用法 
encodeURIComponent() 函数可把字符串作为 URI 组件进行编码。

语法 
encodeURIComponent(URIstring)

参数  描述  
URIstring  必需。一个字符串,含有 URI 组件或其他要编码的文本。 

返回值 
URIstring 的副本,其中的某些字符将被十六进制的转义序列进行替换。

说明 
该方法不会对 ASCII 字母和数字进行编码,也不会对这些 ASCII 标点符号进行编码: - _ . ! ~ * ' ( ) 。

其他字符(比如 :;/?:@&=+$,# 这些用于分隔 URI 组件的标点符号),都是由一个或多个十六进制的转义序列替换的。

提示和注释 
提示:请注意 encodeURIComponent() 函数 与 encodeURI() 函数的区别之处,前者假定它的参数是 URI 的一部分(比如协议、主机名、路径或查询字符串)。因此 encodeURIComponent() 函数将转义用于分隔 URI 各个部分的标点符号。

 

4 总结:

 通过对三个函数的分析,我们可以知道:escape()除了 ASCII 字母、数字和特定的符号外,对传进来的字符串全部进行转义编码,因此如果想对URL编码,最好不要使用此方法。而encodeURI() 用于编码整个URI,因为URI中的合法字符都不会被编码转换。encodeURIComponent方法在编码单个URIComponent(指请求参数)应当是最常用的,它可以讲参数中的中文、特殊字符进行转义,而不会影响整个URL。

 

5 示例:

1 escape()

<script type="text/javascript">

document.write(escape("http://www.w3school.com.cn/") + "<br />")

document.write(escape("?!=()#%&"))

</script>输出:

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>输出:

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

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

,/?:@&=+$#

对整个URL进行编码,而URL的特定标识符不会被转码。

3 encodeURIComponent()

例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输出:

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
例2:<script language="javascript">document.write('

<a href="http://passport.baidu.com/?logout&aid=7&u='+encodeURIComponent("http://cang.baidu.com/bruce42")+'">退出</a>');</script>

对URL中的参数进行编码,因为参数也是一个URL,如果不编码会影响整个URL的跳转。

编码、解码之区别详解:escape()、encodeURI()、encodeURIComponent()

JavaScript中有三个可以对字符串编码的函数,分别是: escape,encodeURI,encodeURIComponent,相应3个解码函数:unescape,decodeURI,decod...
  • ht_gaogao
  • ht_gaogao
  • 2013年06月18日 12:54
  • 580

JS 字符串编码函数(解决URL特殊字符传递问题):escape()、encodeURI()、encodeURIComponent()区别详解

JavaScript中有三个可以对字符串编码的函数,分别是: escape,encodeURI,encodeURIComponent,相应3个解码函数:unescape,decodeURI,decod...
  • jumtre
  • jumtre
  • 2016年05月13日 11:16
  • 3094

谈谈encodeURI和encodeURIComponent以及escape的区别与应用

encodeURI和encodeURIComponent以及escape,这三个都是用来编码的,本篇文章给大家介绍encodeURI和encodeURIComponent以及escape的区别与应用,...
  • xuxiaoping1989
  • xuxiaoping1989
  • 2016年12月27日 16:00
  • 137

.Net工作流项目实战——前台到后台传值的编码、解码解决方案

在页面传值的过程中,通过url进行传值,通常会涉及一些隐私信息,中文信息。那么对于这些信息进行重新编码和解码就是一个刚需!本次在项目中,要从一个页面通过Js代码,给另一个页面传参,通过url传值的方式...
  • u011500356
  • u011500356
  • 2016年05月15日 20:21
  • 1132

页面传参乱码问题与escape()、encodeURI()、encodeURIComponent()区别详解

在用javascript对URL字符串进行编码中,虽然escape()、encodeURI()、encodeURIComponent()三种方法都能对一些影响URL完整性的特殊字符进行过滤。但后两者是...
  • lanwilliam
  • lanwilliam
  • 2015年09月24日 12:50
  • 278

两次调用encodeURI来解决乱码问题

encodeURL函数主要是来对URI来做转码,它默认是采用的UTF-8的编码. UTF-8编码的格式:一个汉字来三个字节构成,每一个字节会转换成16进制的编码,同时添加上%号. 假设页面端输入的中文...
  • u012316120
  • u012316120
  • 2015年08月28日 16:29
  • 1668

encodeURIComponent传入后台解码

$(document).ready(function() { $("#name").focus(); $("#inputForm").validate({ rules:{ ...
  • carl_jiang
  • carl_jiang
  • 2017年04月28日 08:42
  • 2795

为什么需要JS里常需要做两次encodeURI(url)

最近项目里经常出现前后端传送出现乱码的情况,不少同事问一为什么经常需要在JS里进行两次编码,这里进行下说明: 一般情况下, 发送 encodeURIComponent(parmeName)+...
  • posonrick
  • posonrick
  • 2016年05月31日 09:13
  • 3575

前台参数使用Ajax请求时将参数带在URL后面需要两次encodeURI

为什么网上会有人提出在客户端对字符串重复编码两次呢.      如果因为项目需要,不能指定容器使用何种编码规则来解码提交的参数, 比如:需要接收来自不同页面,不同地址编码的参数内容时。 (又或者是开...
  • JAVA528416037
  • JAVA528416037
  • 2015年08月23日 09:56
  • 2947

中文乱码在java中URLEncoder.encode方法要调用两次解决

一、场景: 1、我在客户端要通过get方式调用服务器端的url,将中文参数做utf-8编码,需要在js中两次的进行编码,服务器端才能用decode方法一次获取。 例如:var xing=e...
  • kongqz
  • kongqz
  • 2013年06月05日 10:33
  • 50466
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:escape()、encodeURI()、encodeURIComponent()区别详解
举报原因:
原因补充:

(最多只允许输入30个字)