JavaScript URL 编码

2025年4月18日 | 3 分钟阅读

本文将介绍 JavaScript URL 编码。

URL 编码是将 URL 中的字符转换为可在互联网上传输的格式的过程。

URL 解码是将编码后的 URL 恢复为原始形式的过程。为了能够访问用户,对任何网站的 URL 进行编码和解码至关重要。在 Web 开发中,当通过 GET 请求将查询参数发送到 API 时,就会执行此编码和解码操作。

某些浏览器会自动对 URL 进行编码,例如将一些特殊字符转换为其他字符。

示例:空格字符 " " 会被替换为 %20 或 +。

编码 URL

我们可以使用以下方法进行 URL 编码:

  • 使用 JavaScript encodeURI() 函数
  • 使用 JavaScript encodeURIComponent() 函数
  • 使用 JavaScript escape() 函数

JavaScript encodeURI() 函数

此函数用于编码整个网站的 URL。它可以编码特殊字符,但不包括以下字符:/ ? @ , = & + $ #

语法

演示

在以下演示中,我们将使用 encodeURI() 函数来转换 URL。

代码

输出

我们可以在下面的输出中看到,空格字符已被 %20 替换。

JavaScript URL Encode

JavaScript encodeURlComponent() 函数

此函数用于编码网站 URL 的某些部分。它可以编码特殊字符,也可以编码以下字符:/ ? @ , = & + $ #

语法

演示

在以下演示中,我们将使用 encodeURlComponent() 函数来转换 URL。

代码

输出

下图是输出,我们可以看到空格字符被 %20 替换。

JavaScript URL Encode

JavaScript escape() 函数

escape() 函数用于编码字符串。它将字符串作为单个参数,以便在支持 ASCII 字符的互联网上传输。

语法

演示

在以下演示中,我们将使用 escape() 函数来转换 URL。

代码

输出

我们可以在下面的输出中看到,网站的 URL 已被编码,这意味着字符 "%20" 被替换为空格字符。

JavaScript URL Encode

解码 URL

以下是我们可用于解码任何网站 URL 的方法:

  • 使用 JavaScript decodeURI() 函数
  • 使用 JavaScript decodeURIComponent() 函数
  • 使用 JavaScript unescape() 函数

JavaScript decodeURI() 函数

decodeURI() 方法用于解码使用 encodeURI() 函数编码的任何网站的 URL。

语法

演示

在以下演示中,我们将使用 decodeURI() 函数来解码 URL。

代码

输出

下图是输出,我们可以看到 URL 已被解码。

JavaScript URL Encode

JavaScript decodeURIComponent() 函数

decodeURIComponent() 函数用于解码使用 encodeURIComponent() 编码的 URL 的某些部分。

语法

演示

在以下演示中,我们将使用 decodeURIComponent() 函数来解码任何网站的 URL。

代码

输出

我们可以看到 URL 的某些部分已被空格字符替换。

JavaScript URL Encode

JavaScript unescape() 函数

unescape() 函数用于解码字符串。它将字符串作为单个参数,以便在支持 ASCII 字符的互联网上传输。它解码使用 escape() 函数编码的 URL。

语法

演示

我们将使用 unescape() 函数来解码网站的 URL。

代码

输出

我们可以在下面的输出中看到,URL 已被解码。

JavaScript URL Encode

结论

本文讨论了 JavaScript URL 编码。我们已经了解了可以使用 JavaScript encodeURI() 函数、JavaScript encodeURIComponent() 函数和 JavaScript escape() 函数来编码任何网站的 URL。我们已经了解了可以使用 JavaScript decodeURI() 函数、JavaScript decodeURIComponent() 函数和 JavaScript unescape() 函数来解码任何网站的 URL。


下一主题Javascript-vector