浅谈 JavaScript 的 URL 参数解析(parse)和构建(build)函数
在前端开发中,我们经常需要处理 URL 地址和参数。JavaScript 提供了一些内置的 API 来解析和构建 URL 参数。本文将介绍这些 API,包括 URLSearchParams
、new URL()
、encodeURIComponent()
和 decodeURIComponent()
,并提供示例代码。
URLSearchParams
URLSearchParams
是一个内置对象,用于处理查询字符串(query string)。它可以解析 URL 中的查询字符串,并提供了一些方法来获取和设置参数值。
解析查询字符串
下面是一个示例 URL:
----- --- - ---------------------------------------------------
我们可以使用 URLSearchParams
来解析该 URL 中的查询字符串:
----- ------------ - --- ---------------------------
searchParams
对象中会包含所有的查询参数,我们可以使用 get()
方法来获取参数的值:
----- ----- - --------------------- -- ------- ----- ---- - ------------------------ -- --- ----- ---- - ------------------------ -- ----
设置查询参数
我们也可以使用 URLSearchParams
对象来修改和添加查询参数:
--------------------- ------------ ----------------------------- -------
set()
方法会用新的值替换指定参数的旧值,而 append()
方法则是添加一个新的参数。
最后,我们可以使用 toString()
方法将 URLSearchParams
对象转换为查询字符串:
----- ------ - --------------------------------------------
示例代码
----- --- - --------------------------------------------------- ----- ------------ - --- --------------------------- ---------------------------------- -- ------- --------------------- ------------ ----------------------------- ------- ------------------------------------ -- ----------------------------------------
new URL()
new URL()
是一个构造函数,用于解析 URL 地址。它可以将一个 URL 字符串转换成一个 URL
对象,并提供了一些方法来获取和设置 URL 的各个部分。
解析 URL 字符串
我们可以使用 new URL()
来解析 URL 字符串:
----- --- - --- --------------------------------------------------------
现在我们可以访问 url
对象的属性来获取 URL 的各个部分:
------------------------- -- -------- ------------------------- -- ------------- ------------------------- -- --------- ----------------------- -- -------------------------
设置 URL 部分
我们也可以使用 new URL()
对象来修改 URL 的各个部分:
------------ - ------- ------------ - ---------- ------------ - ----------- ------------------------- ------------
最后,我们可以使用 toString()
方法将 URL
对象转换为 URL 字符串:
----- ------ - --------------
示例代码
----- --- - --- -------------------------------------------------------- ------------------------- -- -------- ------------------------- -- ------------- ------------------------- -- --------- ----------------------- -- ------------------------- ------------ - ------- ------------ - ---------- ------------ - ----------- ------------------------- ------------ --------------------------- -- -----------------------------------------------------
encodeURIComponent() 和 decodeURIComponent()
encodeURIComponent()
是一个函数,用于将字符串编码成 URL 安全的格式。它会将一些特殊字符转换成它们的十六进制 ASCII 编码值,并且会对一些常见的字符进行编码,例如空格、引号等。
我们可以使用 `encodeURIComponent
来源:JavaScript中文网 ,转载请联系管理员! 本文地址:https://www.javascriptcn.com/post/1444