如何在 JavaScript 中高效地从 URL 中提取主机名和路径？

JavaScript 中的 URL 解析：提取主机名和路径

解析 URL 来分离主机名和路径是 Web 开发中的常见操作。在 JavaScript 中，有多种方法可以完成此任务。让我们通过具体示例来探讨其中的一些内容。

现代方法：使用 URL 构造函数

URL 构造函数是一种现代且高效的解析 URL 的方法。它生成一个具有主机名、路径名等属性的对象。例如，给定 URL：

var a = "http://example.com/aa/bb/"

我们可以使用 URL 构造函数解析它：

const parsedURL = new URL(a);
console.log(parsedURL.hostname); // "example.com"
console.log(parsedURL.pathname); // "/aa/bb"

注意： 主机名仅包含域名，不包含域名端口，而主机属性包括两者。

替代方法

正则表达式：

使用正则表达式也可以解析URL。下面是一个示例：

const regex = /^(?:https?:\/\/)?(?:www\.)?([^\/\n]+)(?:\/(.*))?$/;
const match = regex.exec(a);
console.log(match[1]); // "example.com"
console.log(match[2]); // "/aa/bb"

Location 对象：

Location 对象提供对浏览器环境中与 URL 相关的属性的访问。

const parsedURL = window.location;
console.log(parsedURL.hostname); // "example.com"
console.log(parsedURL.pathname); // "/aa/bb"

选择哪种方式取决于具体的需求和环境。对于现代 JavaScript 应用程序，通常建议使用 URL 构造函数，而正则表达式或 Location 对象可能适合遗留支持或特定情况。

以上是如何在 JavaScript 中高效地从 URL 中提取主机名和路径？的详细内容。更多信息请关注PHP中文网其他相关文章！