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 相关文章推荐
JavaScript入门教程(10) 认识其他对象
Jan 31 Javascript
jQuery EasyUI API 中文文档 - ComboBox组合框
Oct 07 Javascript
Javascript+CSS实现影像卷帘效果思路及代码
Oct 20 Javascript
JavaScript之Object类型介绍
Apr 01 Javascript
jquery实现不包含当前项的选择器实例
Jun 25 Javascript
sea.js常用的api简易文档
Nov 15 Javascript
利用Javascript裁剪图片并存储的简单实现
Mar 13 Javascript
Vue实现动态添加或者删除对象和对象数组的操作方法
Sep 21 Javascript
微信小程序 云开发模糊查询实现解析
Sep 02 Javascript
vuex(vue状态管理)的特殊应用案例分享
Mar 03 Javascript
Js图片点击切换轮播实现代码
Jul 27 Javascript
Vue 实现可视化拖拽页面编辑器
Feb 01 Vue.js
基于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
怎样在UNIX系统下安装php3
2006/10/09 PHP
文件系统基本操作类
2006/11/23 PHP
php开发过程中关于继承的使用方法分享
2011/06/17 PHP
phpcms模块开发之swfupload的使用介绍
2013/04/28 PHP
测试php函数的方法
2013/11/13 PHP
php输出xml必须header的解决方法
2014/10/17 PHP
百度实时推送api接口应用示例
2014/10/21 PHP
php调用mysql存储过程实例分析
2014/12/29 PHP
解析PHP的Yii框架中cookie和session功能的相关操作
2016/03/17 PHP
js可突破windows弹退效果代码
2008/08/09 Javascript
PHP中CURL的几个经典应用实例
2015/01/23 Javascript
使用pjax实现无刷新更改页面url
2015/02/05 Javascript
jQuery模拟select实现下拉菜单功能
2016/06/20 Javascript
nodejs redis 发布订阅机制封装实现方法及实例代码
2016/12/15 NodeJs
npm国内镜像 安装失败的几种解决方案
2017/06/04 Javascript
js实现随机点名系统(实例讲解)
2017/10/18 Javascript
浅谈SpringMVC中post checkbox 多选框value的值(隐藏域方式)
2018/01/08 Javascript
vue实现的组件兄弟间通信功能示例
2018/12/04 Javascript
在layui框架中select下拉框监听更改事件的例子
2019/09/20 Javascript
python获取一组汉字拼音首字母的方法
2015/07/01 Python
Python 爬虫爬取指定博客的所有文章
2016/02/17 Python
python使用if语句实现一个猜拳游戏详解
2019/08/27 Python
Python如何存储数据到json文件
2020/03/09 Python
详解python中groupby函数通俗易懂
2020/05/14 Python
Tensorflow tf.tile()的用法实例分析
2020/05/22 Python
Python 虚拟环境工作原理解析
2020/12/24 Python
AmazeUI 点击元素显示全屏的实现
2020/08/25 HTML / CSS
奥地利票务门户网站:oeticket.com
2019/12/31 全球购物
彪马香港官方网上商店:PUMA香港
2020/12/06 全球购物
外贸业务员岗位职责
2013/11/24 职场文书
特色冷饮店创业计划书
2014/01/28 职场文书
研究生导师评语
2014/12/31 职场文书
拔河比赛队名及霸气口号
2015/12/24 职场文书
Mysql效率优化定位较低sql的两种方式
2021/05/26 MySQL
正则表达式拆分url实例代码
2022/02/24 Java/Android
Python正则表达式中flags参数的实例详解
2022/04/01 Python