js中字符串编码函数escape()、encodeURI()、encodeURIComponent()区别详解


Posted in Javascript onApril 01, 2016

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的跳转。

Javascript 相关文章推荐
Js 订制自己的AlertBox(信息提示框)
Jan 09 Javascript
来自qq的javascript面试题
Jul 24 Javascript
javascript使用百度地图api和html5特性获取浏览器位置
Jan 10 Javascript
在浏览器中打开或关闭JavaScript的方法
Jun 03 Javascript
基于BootStrap Metronic开发框架经验小结【六】对话框及提示框的处理和优化
May 12 Javascript
node.js实现博客小爬虫的实例代码
Oct 08 Javascript
微信小程序 UI与容器组件总结
Feb 21 Javascript
JS 插件dropload下拉刷新、上拉加载使用小结
Apr 13 Javascript
JS分页的实现(同步与异步)
Sep 16 Javascript
手把手教你使用vue-cli脚手架(图文解析)
Nov 08 Javascript
简单谈谈CommonsChunkPlugin抽取公共模块
Dec 31 Javascript
Vue.js实现可排序的表格组件功能示例
Feb 19 Javascript
基于jquery实现轮播焦点图插件
Mar 31 #Javascript
javascript中错误使用var造成undefined
Mar 31 #Javascript
详解JavaScript表单验证(E-mail 验证)
Mar 31 #Javascript
js表单验证实例讲解
Mar 31 #Javascript
javascript创建cookie、读取cookie
Mar 31 #Javascript
基于javascript实现全屏漂浮广告
Mar 31 #Javascript
JS深度拷贝Object Array实例分析
Mar 31 #Javascript
You might like
一些关于PHP的知识
2006/11/17 PHP
PHP使用ffmpeg给视频增加字幕显示的方法
2015/03/12 PHP
php校验表单检测字段是否为空的方法
2015/03/20 PHP
thinkphp配置文件路径的实现方法
2016/08/30 PHP
PHP设计模式之工厂模式与单例模式
2016/09/28 PHP
PHP文件操作详解
2016/12/30 PHP
js对象的构造和继承实现代码
2010/12/05 Javascript
js获取当前页的URL与window.location.href简单方法
2017/02/13 Javascript
jQuery插件zTree实现清空选中第一个节点所有子节点的方法
2017/03/08 Javascript
JavaScript生成指定范围随机数和随机序列的方法
2018/05/05 Javascript
webpack多入口多出口的实现方法
2018/08/17 Javascript
解决layui表格内文本超出隐藏的问题
2019/09/12 Javascript
基于javascript实现贪吃蛇小游戏
2019/11/25 Javascript
使用Python的PEAK来适配协议的教程
2015/04/14 Python
从Python的源码浅要剖析Python的内存管理
2015/04/16 Python
使用Python爬取最好大学网大学排名
2018/02/24 Python
Python对象中__del__方法起作用的条件详解
2018/11/01 Python
TensorBoard 计算图的查看方式
2020/02/15 Python
python 读txt文件,按‘,’分割每行数据操作
2020/07/05 Python
Html5中的桌面通知Notification的实现
2018/09/25 HTML / CSS
如何将一个描述日期或日期/时间的字符串转换为一个Date对象
2015/10/13 面试题
技术副厂长岗位职责
2013/12/26 职场文书
师范院校学生自荐信范文
2013/12/27 职场文书
事业单位接收函
2014/01/10 职场文书
20年同学聚会邀请函
2014/02/04 职场文书
计算机数据库专业职业生涯规划书
2014/02/08 职场文书
学习雷锋倡议书
2014/04/15 职场文书
质量管理标语
2014/06/12 职场文书
2014年国庆标语
2014/06/30 职场文书
地理科学专业自荐信
2014/09/01 职场文书
教师思想作风整顿个人剖析材料
2014/10/10 职场文书
员工年终考核评语
2014/12/31 职场文书
横空出世观后感
2015/06/09 职场文书
《当代神农氏》教学反思
2016/02/23 职场文书
CentOS7和8下安装Maven3.8.4
2022/04/07 Servers
Go获取两个时区的时间差
2022/04/20 Golang