正文

JavaScript获取当前URL地址的方法：使用window.location对象中的href属性。例如：window.location.href。

/0 浏览量
0731

在JavaScript中，获取当前网页的URL地址是一个常见且基础的操作。这可以帮助开发者进行页面跳转、数据获取等操作。获取当前URL地址最常用的方法是利用window.location对象中的href属性。下面，我们将详细探讨如何使用这一方法，并附上相应的代码示例。

window.location对象简介

window.location是一个全局对象，它提供了与当前窗口相关的信息，包括当前加载的文档的URL。location对象包含了与URL相关的属性和方法，可以用来获取、设置或重定向当前页面。

使用href属性获取URL

href属性是location对象的一个只读属性，它返回当前窗口的完整URL。以下是获取当前URL地址的步骤：

  1. 访问window.location.href：这是获取URL最直接的方式。

示例代码

以下是一个简单的HTML页面，其中包含了一个JavaScript脚本，用于获取并显示当前页面的URL：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>获取当前URL示例</title>
</head>
<body>
    <h1>当前URL</h1>
    <p id="urlDisplay"></p>
    <script>
        // 获取当前URL
        var currentUrl = window.location.href;
        
        // 显示当前URL
        document.getElementById('urlDisplay').textContent = currentUrl;
    </script>
</body>
</html>

在这个例子中，当页面加载完成后，JavaScript脚本会读取当前页面的URL，并将其显示在页面上。

其他有用的location属性

除了href属性，location对象还包含以下一些有用的属性：

  • protocol：返回URL的协议部分（如”http:“或”https:“）。
  • hostname：返回URL的主机名（如”www.example.com”）。
  • port：返回URL的端口号（如果有的话）。
  • pathname：返回URL的路径部分（从域名后开始）。
  • search：返回URL的查询字符串部分（问号后开始）。
  • hash：返回URL的片段标识符（井号后开始）。

这些属性可以单独使用，也可以组合起来使用，以获取更详细的URL信息。

总结

通过使用window.location.href，我们可以轻松地获取当前页面的URL地址。这是一个简单但非常有用的操作，对于开发者在进行网页编程时尤其重要。掌握这个基础技能，将为你的开发之旅奠定坚实的基础。

-- 展开阅读全文 --