js对url进行编码和解码(三种方式区别)

本文介绍了JavaScript中escape和unescape、encodeURI和decodeURI、encodeURIComponent和decodeURIComponent的用法,展示了如何对URL进行编码和解码,确保非ASCII字符在URL中的正确表示。
摘要由CSDN通过智能技术生成

*** 只有 0-9[a-Z] $ - _ . + ! * ' ( ) , 以及某些保留字,才能不经过编码直接用于 URL。

***例如:搜索的中文关键字,复制网址之后再粘贴就会发现该URL已经被转码。

1、escape 和 unescape

原理:对除ASCII字母、数字、标点符号 @  *  _  +  -  .  / 以外的其他字符进行编码。

编码:escape('http://www.baidu.com?name=zhang@xiao@jie&order=1')

   结果:"http%3A//www.baidu.com%3Fname%3Dzhang@xiao@jie%26order%3D1"

   escape('张')

   结果:"%u5F20"

解码:unescape("http%3A//www.baidu.com%3Fname%3Dzhang@xiao@jie%26order%3D1")

   结果:"http://www.baidu.com?name=zhang@xiao@jie&order=1"

   unescape("%u5F20")

   结果:"张"

2、encodeURI 和 decodeURI

原理:返回编码为有效的统一资源标识符 (URI) 的字符串,不会被编码的字符:! @ # $ & * ( ) = : / ; ? + '

     encodeURI()是Javascript中真正用来对URL编码的函数。

编码:encodeURI('http://www.baidu.com?name=zhang@xiao@jie&order=1')

   结果:"http://www.baidu.com?name=zhang@xiao@jie&order=1"

解码:decodeURI("http%3A//www.baidu.com%3Fname%3Dzhang@xiao@jie%26order%3D1")

   结果:"http%3A//www.baidu.com%3Fname%3Dzhang@xiao@jie%26order%3D1"

3、encodeURIComponent 和 decodeURIComponent

原理:对URL的组成部分进行个别编码,而不用于对整个URL进行编码

编码:encodeURIComponent('http://www.baidu.com?name=zhang@xiao@jie&order=1')
   结果:"http%3A%2F%2Fwww.baidu.com%3Fname%3Dzhang%40xiao%40jie%26order%3D1"

解码:decodeURIComponent("http%3A%2F%2Fwww.baidu.com%3Fname%3Dzhang%40xiao%40jie%26order%3D1")

   "http://www.baidu.com?name=zhang@xiao@jie&order=1"

参考资源链接:[JavaScript encodeURI与decodeURI方法详解](https://wenku.csdn.net/doc/nfnm9mxsur?utm_source=wenku_answer2doc_content) 在处理URL中的中文字符时,我们经常需要使用`encodeURI()`和`decodeURI()`方法来进行有效的编码解码。这两个方法是JavaScript中的内置函数,它们帮助我们确保URL在浏览器地址栏、查询参数以及其他需要URL传递信息的场景中能正确工作。 为了详细解释如何使用这两个方法,我们首先需要了解编码解码的基本概念。编码是将字符转换成URL可以安全传输的格式,而解码则是将这些编码后的字符转换回原始形态。 1. `encodeURI()`函数用于将包括中文字符在内的非ASCII字符转换为URL兼容格式。这个方法不会编码那些在URI中有特殊意义的字符。比如,如果我们的URL是包含中文的: ```javascript var url = '***路径/测试?name=张三'; var encodedUrl = encodeURI(url); ``` 执行后,'张三'会被转换为'张三'的编码形式,即每个中文字符都会转换为对应的Unicode编码,并以百分号编码的形式出现在URL中。 2. `decodeURI()`函数则是`encodeURI()`的逆操作,它可以将经过`encodeURI()`编码URL转换回原始的字符串形式。这样,接收方就可以正确解析出包含中文字符的URL: ```javascript var decodedUrl = decodeURI(encodedUrl); ``` 执行后,经过编码URL会被转换回原始形式。 在使用`encodeURI()`和`decodeURI()`时,重要的是要注意`encodeURI()`不会编码一些保留字符,如':', '/', ';', '?'等。如果你需要对这些保留字符进行编码,应使用`encodeURIComponent()`方法,它会编码所有字符(除了字母、数字和一些特定字符)。 为了进一步深入理解这些方法的使用和实现,建议阅读《JavaScript encodeURI与decodeURI方法详解》一书。书中详细介绍了`encodeURI()`和`decodeURI()`的用法,以及它们与其他编码解码函数的关系和区别,还有如何处理一些特殊情况,如使用正则表达式进行更复杂的URL参数提取等。 参考资源链接:[JavaScript encodeURI与decodeURI方法详解](https://wenku.csdn.net/doc/nfnm9mxsur?utm_source=wenku_answer2doc_content)
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值