javascript基础从小白到高手系列二千零九十一：操作地址

最新推荐文章于 2024-11-16 14:11:26 发布

完美句号

最新推荐文章于 2024-11-16 14:11:26 发布

阅读量413

点赞数 3

文章标签： javascript 开发语言 ecmascript

本文链接：https://blog.csdn.net/wanmeijuhao/article/details/142171411

版权

可以通过修改 location 对象修改浏览器的地址。首先，最常见的是使用 assign()方法并传入一个 URL，如下所示:

location.assign("http://www.wrox.com");

这行代码会立即启动导航到新 URL 的操作，同时在浏览器历史记录中增加一条记录。如果给 location.href 或 window.location 设置一个 URL，也会以同一个 URL 值调用 assign()方法。比如，下面两行代码都会执行与显式调用 assign()一样的操作:

  window.location = "http://www.wrox.com";
   location.href = "http://www.wrox.com";

在这 3 种修改浏览器地址的方法中，设置 location.href 是最常见的。
修改 location 对象的属性也会修改当前加载的页面。其中，hash、search、hostname、pathname 和 port 属性被设置为新值之后都会修改当前 URL，如下面的例子所示:

// 假设当前URL为http://www.wrox.com/WileyCDA/
// 把URL修改为http://www.wrox.com/WileyCDA/#section1
    location.hash = "#section1";
// 把URL修改为http://www.wrox.com/WileyCDA/?q=javascript location.search = "?q=javascript";
// 把URL修改为http://www.somewhere.com/WileyCDA/ location.hostname = "www.somewhere.com";
// 把URL修改为http://www.somewhere.com/mydir/ location.pathname = "mydir";
// 把URL修改为http://www.somewhere.com:8080/WileyCDA/ location.port = 8080;

除了 hash 之外，只要修改 location 的一个属性，就会导致页面重新加载新 URL。

在以前面提到的方式修改 URL 之后，浏览器历史记录中就会增加相应的记录。当用户单击“后退” 按钮时，就会导航到前一个页面。如果不希望增加历史记录，可以使用 replace()方法。这个方法接收一个 URL 参数，但重新加载后不会增加历史记录。调用 replace()之后，用户不能回到前一页。比如下面的例子:

   <!DOCTYPE html>
    <html>
    <head>
      <title>You won't be able to get back here</title>
    </head>
    <body>
      <p>Enjoy this page for a second, because you won't be coming back here.</p>
      <script>
setTimeout(() => location.replace("http://www.wrox.com/"), 1000); </script>
    </body>
    </html>