JS获取url链接字符串 location.href

织梦狗教程前端开发

2024-01-08

获取当前网页的URL链接字符串是一个常见的需求，而在JavaScript中，我们可以通过location.href属性来实现。

获取当前网页的URL链接字符串是一个常见的需求，而在JavaScript中，我们可以通过location.href属性来实现。

location.href是一个字符串，包含当前页面的完整URL。你可以直接打印location.href来查看当前页面的URL。

示例一：获取当前页面的URL并显示在页面上

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>示例一</title>
  <script>
    // 获取当前页面的URL并显示在页面上
    document.write('当前页面的URL为：' + location.href);
  </script>
</head>
<body>

</body>
</html>

在该示例中，我们使用了document.write()方法将获取到的URL输出到页面上。

示例二：根据URL链接参数的不同跳转到不同的页面

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>示例二</title>
  <script>
    // 获取URL链接参数
    const urlParams = new URLSearchParams(window.location.search);
    // 判断参数值并跳转到不同的页面
    if (urlParams.has('name') && urlParams.has('age')) {
      const name = urlParams.get('name');
      const age = urlParams.get('age');
      if (age > 18) {
        window.location.href = 'http://adult-page.com?name=' + name;
      } else {
        window.location.href = 'http://child-page.com?name=' + name;
      }
    } else {
      alert('请正确填写参数！');
    }
  </script>
</head>
<body>

</body>
</html>

在该示例中，我们通过const urlParams = new URLSearchParams(window.location.search)获取到了当前页面的URL链接参数。接着，我们通过判断链接参数的不同，执行不同的页面跳转操作。

以上就是获取location.href的完整攻略，希望能对你有所帮助。

织梦狗教程

本文标题为：JS获取url链接字符串 location.href