encodeURI 方法

将文本字符串编码为一个有效的统一资源标识符 (URI)。

encodeURI(URIString)

必选的 URIString 参数代表一个已编码的 URI。

说明
encodeURI 方法返回一个编码的 URI。如果您将编码结果传递给 decodeURI，那么将返回初始的字符串。encodeURI 方法不会对下列字符进行编码：":"、"/"、";" 和 "?"。请使用 encodeURIComponent 方法对这些字符进行编码。

encodeURIComponent 方法

将文本字符串编码为一个统一资源标识符 (URI) 的一个有效组件。

encodeURIComponent(encodedURIString)

必选的 encodedURIString 参数代表一个已编码的 URI 组件。

说明
encodeURIComponent 方法返回一个已编码的 URI。如果您将编码结果传递给 decodeURIComponent，那么将返回初始的字符串。因为 encodeURIComponent 方法对所有的字符编码，请注意，如果该字符串代表一个路径，例如 /folder1/folder2/default.html，其中的斜杠也将被编码。这样一来，当该编码结果被作为请求发送到 web 服务器时将是无效的。如果字符串中包含不止一个 URI 组件，请使用 encodeURI 方法进行编码

一、encodeURI、encodeURIComponent概念比较
encodeURI —— 该函数不对 ASCII 字母和数字以及ASCII标点符号（包括- _ . ! ~ * ' ( )）进行编码，其他字符（比如 ：;/?:@&=+$,# 这些用于分隔 URI 组件的标点符号），也不会被转义。

encodeURIComponent —— 该函数也不对 ASCII 字母和数字以及ASCII标点符号（包括- _ . ! ~ * ' ( )）进行编码，其他字符（比如 ：;/?:@&=+$,# 这些用于分隔 URI 组件的标点符号），会被由一个或多个十六进制组成的转义序列替换。

decodeURI和decodeURIComponent是它们对应的解码函数，不再多说。下面看一下测试代码

二、encodeURI、encodeURIComponent测试代码
1、测试JS代码：

2、脚本输出：

3、总结

留意一下上面输出中的红色部分，所以从表观上的解释（天缘自己理解*_*）：

encodeURIComponent是把整个参数都当成一个Component处理了，认为你给我的东西后续使用时是“贴”在其它“标准”URI后面做参数值用的，而encodeURI则认为你就让我编码一个URI，这个URI可能是直接使用的。