javascript 获取 url 路径

Java

如何使用 JavaScript 获取 URL 路径

在开发网页应用程序时，有时需要获取当前页面的 URL 路径。JavaScript 提供了一种简单的方式来获取 URL 路径，以便在需要时进行处理或显示。本文将介绍如何使用 JavaScript 获取 URL 路径，并提供相关的案例代码。

获取 URL 路径的方法是使用 JavaScript 中的 window.location 对象。该对象包含了当前页面 URL 的相关信息，包括协议、主机名、路径、查询参数等。

以下是使用 JavaScript 获取 URL 路径的常见方法：

1. 获取完整的 URL：

Javascript
var url = window.location.href;

2. 获取协议部分：

Javascript
var protocol = window.location.protocol;

3. 获取主机名部分：

Javascript
var hostname = window.location.hostname;

4. 获取路径部分：

Javascript
var path = window.location.pathname;

5. 获取查询参数部分：

Javascript
var search = window.location.search;

使用上述方法可以轻松地获取 URL 路径的各个部分，然后根据需要进行处理或显示。下面的案例将演示如何使用 JavaScript 获取 URL 路径并显示在页面上。

html
<!DOCTYPE html>
<html>
<head>
  <title>获取 URL 路径示例</title>
  <script>
    function showURL() {
      var url = window.location.href;
      document.getElementById("url").innerText = url;
    }
  </script>
</head>
<body>
  <h1>当前页面的 URL 路径是：</h1>
  
  <script>
    showURL();
  </script>
</body>
</html>

在上述案例中，我们定义了一个名为 showURL 的 JavaScript 函数，在页面加载完成后调用该函数。该函数使用 window.location.href 获取当前页面的完整 URL，并将其显示在页面上的

元素中。

使用 JavaScript 获取 URL 路径

通过 JavaScript 获取 URL 路径是在网页开发中常用的操作。本文介绍了如何使用 JavaScript 中的 window.location 对象来获取 URL 的各个部分，包括完整的 URL、协议、主机名、路径和查询参数。我们还提供了一个简单的案例代码，演示了如何获取 URL 路径并将其显示在页面上。

在实际开发中，获取 URL 路径可以用于多种用途，如根据路径判断当前页面所在的位置、在导航菜单中高亮显示当前页面等。掌握如何使用 JavaScript 获取 URL 路径将有助于更好地处理和管理网页应用程序。