获取网页 URL 的 JavaScript 方法指南266

在 JavaScript 中，获取当前网页的 URL 是一项基本但重要的任务。URL（统一资源定位符）标识互联网上的资源，了解如何检索它对于许多 Web 应用程序和脚本至关重要。

JavaScript 提供了多种方法来获取 URL，每种方法都有其优点和缺点。在本指南中，我们将探讨这些方法，并提供示例代码。

1.

最简单的方法是使用 属性。它返回当前页面的完整 URL。 ```js
const url = ;
```

这种方法简单明了，但它返回的是一个绝对 URL，其中包含端口号、协议和完整路径。在某些情况下，您可能需要更精细地控制返回的 URL。

2.

属性返回当前页面的源，不包括路径或片段。```js
const origin = ;
```

这对于跨域通信很有用，因为 始终返回与当前页面相同源的 URL。

3.

属性返回当前页面的路径，不包括协议、端口号或片段。```js
const pathname = ;
```

这对于在导航栏中创建面包屑或构建页面结构很有用。

4.

属性返回当前页面的查询字符串，即 URL 中问号 (?) 后面的部分。```js
const search = ;
```

这对于解析表单提交的数据或从 URL 中提取参数很有用。

5.

属性返回当前页面的片段标识符，即 URL 中井号 (#) 后面的部分。```js
const hash = ;
```

这对于锚链接和在页面内导航很有用。

6.

对象还提供了其他一些有用的方法来操作 URL：* () 重新加载页面并将其导航到指定 URL。
* () 替换当前页面并将其导航到指定 URL，不会在历史记录中创建新条目。
* () 重新加载当前页面。

实例：

下例说明了如何使用这些方法来获取 URL 的不同部分：```js
const url = ; // 获取完整 URL
const origin = ; // 获取源
const pathname = ; // 获取路径
const search = ; // 获取查询字符串
const hash = ; // 获取片段标识符
(`完整的 URL: ${url}`);
(`源: ${origin}`);
(`路径: ${pathname}`);
(`查询字符串: ${search}`);
(`片段标识符: ${hash}`);
```

在 JavaScript 中获取网页 URL 是一项简单的任务，有多种方法可供选择。根据您的具体需求，您可以选择最适合您应用程序的方法。通过理解这些方法，您可以有效地处理 URL 并构建强大的基于 Web 的应用程序。

2024-12-24

上一篇：使用 JavaScript 动态显示和隐藏图片

下一篇：如何使用 JavaScript 将字符串转换为数字