如何使用 JavaScript 解析 URL57

URL（统一资源定位符）是一种用来标识互联网上资源的地址。它由多个部分组成，包括协议、主机、端口号、路径和查询字符串。JavaScript 提供了许多方法来解析和操作 URL，以便开发人员可以轻松地从 URL 中提取所需的信息。

使用 JavaScript 解析 URL 的方法1. 使用 URL() 构造函数
URL() 构造函数可以创建一个 URL 对象，该对象包含有关 URL 的所有信息。可以通过将 URL 字符串作为参数传递给构造函数来创建 URL 对象：
```
const url = new URL('/path/to/?query=string');
```
2. 使用 anchor 元素
anchor 元素（``）提供对 URL 的访问。可以通过访问 anchor 元素的 `href` 属性来获取 URL 字符串：
```
const url = ('a').href;
```
3. 使用 location 对象
location 对象提供了有关当前文档 URL 的信息。可以通过访问 `location` 对象的 `href` 属性来获取 URL 字符串：
```
const url = ;
```

解析 URL 的各个部分一旦创建了 URL 对象，就可以使用其属性来解析 URL 的各个部分：
* 协议 (protocol)：可以通过访问 `protocol` 属性获取协议：
```
const protocol = ;
```
* 主机 (host)：可以通过访问 `host` 属性获取主机：
```
const host = ;
```
* 端口号 (port)：可以通过访问 `port` 属性获取端口号：
```
const port = ;
```
* 路径 (pathname)：可以通过访问 `pathname` 属性获取路径：
```
const pathname = ;
```
* 查询字符串 (search)：可以通过访问 `search` 属性获取查询字符串：
```
const search = ;
```

修改 URL 的各个部分URL 对象还允许修改 URL 的各个部分：
* 设置协议：可以使用 `protocol` 属性设置协议：
```
= 'https:';
```
* 设置主机：可以使用 `host` 属性设置主机：
```
= '';
```
* 设置端口号：可以使用 `port` 属性设置端口号：
```
= 8080;
```
* 设置路径：可以使用 `pathname` 属性设置路径：
```
= '/new/path/to/';
```
* 设置查询字符串：可以使用 `search` 属性设置查询字符串：
```
= '?newQuery=string';
```

将 URL 转换为字符串修改 URL 的各个部分后，可以通过调用 `toString()` 方法将 URL 对象转换为字符串：
```
const urlString = ();
```

使用 JavaScript 解析 URL 的示例以下示例演示如何使用 JavaScript 解析和修改 URL：
```
const url = new URL('/path/to/?query=string');
(); // 输出: https:
(); // 输出:
(); // 输出: /path/to/
(); // 输出: ?query=string
= 'ftp:';
= '';
= '/new/path/to/';
= '?newQuery=string';
(()); // 输出: ftp:///new/path/to/?newQuery=string
```

2025-02-11

上一篇：JavaScript 封装类：深入理解对象封装的艺术

下一篇：JavaScript IP 验证：全面指南