encodeURIComponent
https%3A%2F%2Fexample.com%2Fsearch%3Fq%3D%E9%85%B7%E7%AB%99%E6%B1%87%20%E5%B7%A5%E5%85%B7%26tag%3D%E5%BC%80%E5%8F%91%23%E9%A1%B6%E9%83%A8
拼参数值就用它：中文、空格、& = ? # / 全部转义，最安全
encodeURI
https://example.com/search?q=%E9%85%B7%E7%AB%99%E6%B1%87%20%E5%B7%A5%E5%85%B7&tag=%E5%BC%80%E5%8F%91#%E9%A1%B6%E9%83%A8
整段 URL 直接转义时用它：保留 : / ? & # 等结构字符
表单编码
https%3A%2F%2Fexample.com%2Fsearch%3Fq%3D%E9%85%B7%E7%AB%99%E6%B1%87+%E5%B7%A5%E5%85%B7%26tag%3D%E5%BC%80%E5%8F%91%23%E9%A1%B6%E9%83%A8
application/x-www-form-urlencoded 风格，空格变 + 号，老接口常见
输入长度
45 字符
非 ASCII 字符
9 个
中文在 URL 里按 UTF-8 每字占 3 字节，编码后变 %XX%XX%XX
编码后长度
137 字符
膨胀约 304%
查询参数拆解
https://example.com/search · 锚点 #顶部
| 参数名 | 值（已解码） | 操作 |
|---|---|---|
| q | 酷站汇 工具 | |
| tag | 开发 |
工具介绍
URL 里的中文和空格必须转成 %XX 才能安全传输，但同一个字符串用 encodeURIComponent、encodeURI 还是表单编码，结果并不一样。最常见的事故是把带 & 的参数值交给 encodeURI——它不转义 &，后端收到的是两个参数。这里三种写法一次给全并写清各自适用场景，顺手把链接的参数拆成表格，排查「参数怎么丢了」不用来回切控制台。
怎么用
- 选「编码」或「解码」，把内容粘进去
- 要拼进 query 的值，复制 encodeURIComponent 那一行
- 整段链接看 encodeURI 的结果；怀疑被编码了两次就点「再解一次」
常见问题
为什么中文变成乱码？
URL 只能安全传输 ASCII，中文要先按 UTF-8 编成 3 字节再写成 %E4%B8%AD 这种形式。如果对方按 GBK 解码就会乱码，问题在两端编码约定不一致，不是转义本身出错。
encodeURIComponent 和 encodeURI 用哪个？
转义单个参数值用 encodeURIComponent，它会连 & = ? # / 一起转义；转义一整条已经拼好的 URL 用 encodeURI，保留这些结构字符。
空格是变 %20 还是 +？
路径和查询串的规范写法是 %20；老式表单提交（application/x-www-form-urlencoded）用 +。多数后端两种都认，但别在同一个值里混用。
提示「% 转义不完整」怎么办？
说明字符串里有单独的 %，或 % 后面不是两位十六进制。常见于复制时被截断，或者这段内容本来就不是编码结果。