介绍
url-parse 是一个 Node.js 和浏览器端都可用的 URL 解析库，它可以将 URL 字符串解析成对象形式，方便获取 URL 的各个部分。
在前端开发过程中，经常需要对 URL 进行处理，例如获取 URL 参数、修改 URL 中的某些部分等，使用 url-parse 可以更加方便地完成这些操作。
安装
使用 npm 安装 url-parse：
npm install url-parse --save
使用
引入 url-parse：
const URLParse = require('url-parse');或者使用 ES6 模块：
import URLParse from 'url-parse';
解析 URL 字符串：
const url = new URLParse('https://github.com/search?q=url-parse&o=desc&s=stars&type=Repositories');获取 URL 的各个部分：
-- -------------------- ---- ------- -- ---- -------------------------- -- ------ -- ------------ -------------------------- -- ---------- -- ----- ---------------------- -- -- -- ---- -------------------------- -- ------- -- ------ ----------------------- -- -------------------------------------------- -- ------------ ----------------------------- -- - -- ------------ -- ------- -- -------- ----- -------------- - -- -- ---- - ---------------------- -- --
修改 URL 的某些部分：
-- -------------------- ---- ------- -- ------ ---------------- --------------------------------------------------- ---------------------------- -- ------------------------------------------------------------------------- -- ------ ---------------- - -- ------------- -- -------- -- -------- ----- ---------------- ---- ----- --- ---------------------------- -- --------------------------------------------------------------------------------- -- ------ --------- - --- ---------------------------- -- -------------------------
指导意义
使用 url-parse 可以更加方便地处理 URL，提高开发效率。在实际项目中，经常需要对 URL 进行处理，例如根据 URL 参数展示不同的内容、获取当前页面的 URL 等等。
除了使用第三方库外，也可以借助原生 API 实现类似的功能，例如使用 location 对象获取当前页面的 URL，使用 URLSearchParams 对象获取 URL 参数等等。
示例代码
这里是一个示例代码，通过获取 URL 中的查询参数展示不同的内容：
-- -------------------- ---- -------
--------- -----
------
------
---------- ------------
-------
------
---- -------------------
------- -------------------------------------------
--------
----- --- - --- --------------------------
----- ----- - --------------------------
-- ------ --- ------ -
-------------------------------------------- - ------- --- ---------
- ---- -- ------ --- ------ -
-------------------------------------------- - ------- --- ---------
- ---- -
-------------------------------------------- - -----------------
-
---------
-------
-------在这个示例中，根据 URL 中的查询参数展示不同的内容。例如访问 http://example.com/?q=foo 时，页面展示 <h1>展示 foo 内容</h1>。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/42140