什么是 URIjs
URIjs 是一款用于解析、操作和构建 URI（Uniform Resource Identifier，统一资源标识符）的 JavaScript 库。它不依赖于任何框架，可以轻松地处理 URL 和 URI。
安装 URIjs
URIjs 可以通过 npm 包管理器安装，打开终端并在项目文件夹中运行以下命令：
npm install urijs
URIjs 常用方法
解析 URL
URI(url);
使用 URI() 构造函数，您可以解析 URL 并获得 URI 对象。
var url = "http://www.example.com/?name=Jack&age=30#home";
var uri = new URI(url);
console.log(uri.search(true));
// {name: "Jack", age: "30"}修改 URL
uri.addQuery({key: "value"});使用 addQuery() 方法，您可以添加查询参数。
console.log(uri.addQuery({gender: "male"}).toString());
// http://www.example.com/?name=Jack&age=30&gender=male#home获取 URL 的不同部分
-- -------------------- ---- ------- --------------- --------------- --------------- ------------- ---------------- ---------- ----------- ----------- ------------ ---------------
以上这些方法返回 URI 的不同部分。
console.log(uri.query()); // name=Jack&age=30&gender=male
构建 URL
uri.protocol(protocol); uri.username(username); uri.password(password); uri.host(domain); uri.port(port); uri.path(path); uri.query(query); uri.fragment(fragment);
以上这些方法可以让您构建并修改 URI 对象。
var uri = new URI();
uri.protocol("https");
uri.host("www.example.com");
uri.path("/products/electronics.html");
uri.query({category: "smartphones", brand: "apple"});
console.log(uri.toString());
// https://www.example.com/products/electronics.html?category=smartphones&brand=apple示例
下面是一个使用 URIjs 的示例代码，它从 URL 中提取查询参数，并根据参数值显示不同的文本。
HTML：
-- -------------------- ---- -------
--------- -----
------
------
----- ----------------
------------ ------------
-------
------
-- -----------------
------- -----------------------------------------------------------------
------- ----------------------
-------
-------JavaScript：
var uri = new URI();
var query = uri.search(true);
if (query.type === "welcome") {
document.getElementById("message").innerHTML = "欢迎光临！";
} else if (query.type === "goodbye") {
document.getElementById("message").innerHTML = "再见！";
}URL：
http://www.example.com/?type=welcome
在这个例子中，如果 URL 中包含 type=welcome，页面将显示 "欢迎光临！"。如果 URL 中包含 type=goodbye，页面将显示 "再见！"。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/70032