1、escape和它们不是同一类

  简单来说,escape是对字符串(string)进行编码(而另外两种是对URL),作用是让它们在所有电脑上可读。编码之后的效果是%XX或者%uXXXX这种形式。其中 ASCII字母、数字、@*/+ ,这几个字符不会被编码,其余的都会。

  最关键的是,当你需要对URL编码时,请忘记这个方法,这个方法是针对字符串使用的,不适用于URL。事实上,这个方法我还没有在实际工作中用到过,所以就不多讲了。

2、最常用的encodeURI和encodeURIComponent

  对URL编码是常见的事,所以这两个方法应该是实际中要特别注意的。它们都是编码URL,唯一区别就是编码的字符范围,其中:
  (1)encodeURI方法不会对下列字符编码  ASCII字母、数字、~!@#$&*()=:/,;?+'
  (2)encodeURIComponent方法不会对下列字符编码 ASCII字母、数字、~!*()'
  所以encodeURIComponent比encodeURI编码的范围更大。
  实际例子来说,encodeURIComponent会把 http://  编码成  http%3A%2F%2F 而encodeURI却不会。

3、最重要的,我该什么场合用什么方法

  区别上面说的很清楚了,接下来从实际例子来说说把。

  (1)如果只是编码字符串,不和URL有半毛钱关系,那么用escape。

  (2)如果你需要编码整个URL,然后需要使用这个URL,那么用encodeURI。

  比如:

encodeURI("http://www.cnblogs.com/season-huang/some other thing");

//编码后会变为:"http://www.cnblogs.com/season-huang/some%20other%20thing";

//其中,空格被编码成了%20。但是如果你用了encodeURIComponent,那么结果变为:"http%3A%2F%2Fwww.cnblogs.com%2Fseason-huang%2Fsome%20other%20thing"

  看到了区别吗,连 "/" 都被编码了,整个URL已经没法用了。

  (3)当你需要编码URL中的参数的时候,那么encodeURIComponent是最好方法。

var param = "http://www.cnblogs.com/season-huang/"; //param为参数
param = encodeURIComponent(param);
var url = "http://www.cnblogs.com?next=" + param;
console.log(url) //"http://www.cnblogs.com?next=http%3A%2F%2Fwww.cnblogs.com%2Fseason-huang%2F"

  看到了把,参数中的 "/" 可以编码,如果用encodeURI肯定要出问题,因为后面的/是需要编码的。

JS编码三种方法的区别:escape、encodeURI和encodeURIComponent的更多相关文章

  1. jQuery中detach&&remove&&empty三种方法的区别

    jQuery中empty&&remove&&detach三种方法的区别 empty():移除指定元素内部的所有内容,但不包括它本身 remove():移除指定元素内部的 ...

  2. HTML5结合CSS的三种方法+结合JS的三种方法

    HTML5+CSS: HTML中应用CSS的三种方法 一.内联 内联样式通过style属性直接套进HTML中去. 示例代码 <pstylepstyle="color:red" ...

  3. (一)JQuery动态加载js的三种方法

    Jquery动态加载js的三种方法如下: 第一种: $.getscript("test.js"); 例如: <script type="text/javascrip ...

  4. 《Java多线程面试题》系列-创建线程的三种方法及其区别

    1. 创建线程的三种方法及其区别 1.1 继承Thread类 首先,定义Thread类的子类并重写run()方法: package com.zwwhnly.springbootaction.javab ...

  5. 异步加载js的三种方法

    js加载时间线 : 它是根据js出生的那一刻开始记录的一系列浏览器按照顺序做的事,形容的就是加载顺序,可以用来优化什么东西,理论基础,背下来. 1.创建Document对象,开始解析web页面.解析H ...

  6. 在 C# 中,(int) ,Int32.Parse() 和 Convert.toInt32() 三种方法的区别

    在 C# 中,(int),Int32.Parse() 和 Convert.toInt32() 三种方法有何区别? int 关键字表示一种整型,是32位的,它的 .NET Framework 类型为 S ...

  7. 【c#文档】在 C# 中,(int) ,Int32.Parse() 和 Convert.toInt32() 三种方法的区别

    [c#文档]https://msdn.microsoft.com/zh-cn/library/system.convert.toint32.aspx 转载自:http://www.cnblogs.co ...

  8. 应对加密js的三种方法

    经常遇到网页在登录后会对用户输入的帐号和密码通过js进行加密,导致模拟登录这类网站时受到阻碍 这里小记一下当前解决该问题的三种方法 1.利用python实现js同等加密. 2.利用selenium模拟 ...

  9. 隐藏input的三种方法和区别

    一.<input type="hidden" />二.<input type="text" style="display:none& ...

随机推荐

  1. Ddos攻击防护

    Ddos攻击防护 首先我们说说ddos攻击方式,记住一句话,这是一个世界级的难题并没有解决办法只能缓解 DDoS(Distributed Denial of Service,分布式拒绝服务)攻击的主要 ...

  2. [Codeforces Round #513 by Barcelona Bootcamp (rated, Div. 1 + Div. 2) ](A~E)

    A: 题目大意:给你一个数字串,每个数字只可以用一次,求最多可以组成多少个电话号码(可以相同),电话号码第一个数字为$8$,且长度为$11$ 题解:限制为$8$的个数和总长度,直接求 卡点:无 C++ ...

  3. vue-计算属性-computed

    /* 计算属性:vue中对数据进行一些组合与计算的话,可以使用computed(计算属性); //例如:获取当前日期,组合 */ // 组合变成10-1 var vm = new Vue({ el: ...

  4. Leetcode 4. Median of Two Sorted Arrays(二分)

    4. Median of Two Sorted Arrays 题目链接:https://leetcode.com/problems/median-of-two-sorted-arrays/ Descr ...

  5. python代理池的实现

    https://github.com/wangqifan/ProxyPool http://python.jobbole.com/86994/

  6. [从hzwer神犇那翻到的模拟赛题] 合唱队形

    [问题描述] 学校要进行合唱比赛了,于是班主任小刘准备给大家排个队形. 他首先尝试排成m1行,发现最后多出来a1个同学:接着他尝试排成m2行,发现最后多出来a2个同学,……,他尝试了n种排队方案,但每 ...

  7. SoundPool 播放提示音

    SoundPool 一个声音播放的辅助类,从名字可以看出,它具有 “池”的能力,它先加载声音文件到内存,以支持多次播放声音文件. 特点 SoundPool适合 短小的 声音文件 SoundPool适合 ...

  8. 算法详解(LCA&RMQ&tarjan)补坑啦!完结撒花(。◕ˇ∀ˇ◕)

    首先,众所周知,求LCA共有3种算法(树剖就不说了,太高级,以后再学..). 1.树上倍增(ST表优化) 2.RMQ&时间戳(ST表优化) 3.tarjan(离线算法)不讲..(后面补坑啦!) ...

  9. 【linux高级程序设计】(第十五章)UDP网络编程应用 2

    UDP广播通信 单播:一对一,TCP和UDP均可完成 广播:只能UDP完成.广播时发送方只发送一个数据包,但是网络上的交换机默认转发广播数据包到所有端口.路由器默认不转发任何广播数据包.故广播在局域网 ...

  10. array数据初始化

    #include <iostream> int main() { ]={}; std::cout<<array[]<<]; } 试了试上面的代码发现,数组在用{}赋 ...