使用location对象可以通过很多方式来改变浏览器的位置,总结如下:
跳转到新的URL | loncation.assign | loncation.assign("http://www.baidu.com") |
window.location | window.location="http://www.baidu.com" | |
location.href | location.href="http://www.baidu.com" | |
设置或改变URL的部分值, 【JS|使用location操作浏览器的页面跳转】 |
hash(片段标识符) | 假设URL初始值为http://www.wrox.com/WileyCDA/ location.hash="#section1"; 将URL修改为了http://www.wrox.com/WileyCDA/#section1 |
search(查询字符串) | 假设URL初始值为http://www.wrox.com/WileyCDA/ location.search="?setion1"; //将URL修改为“http://www.wrox.com/WileyCDA/?section1”; |
|
hostname(服务器名称) | 假设URL初始值为http://www.wrox.com/WileyCDA/ location.hostname="www.yahoo.com"; //将URL修改为“http://www.yahoo.com”; |
|
pathname(文件路径) | 假设初始URL为“http://www.yahoo.com”;
location.pathname="mydir"; //将URL修改为"http://www.yahoo.com/mydir/" |
|
port(端口号) | 假设初始URL为“http://www.yahoo.com/mydir/”;
location.port=8080; //无需双引号; //将URL修改为"http://www.yahoo.com:8080/WileyCDA/" |
如果需要禁用生成新的记录,则可以使用replace()方法,使用这个方法之后,浏览器位置虽然会发生改变,但不会在浏览器中生成新的访问记录,用户无法后退,不能回到前一个页面,例子如下:
你无法再次回到这个页面 - 锐客网
三秒之后这个页面会跳转到百度,之后无法再回到之后页面
页面跳转之后,无回退键;
location的最后一个方法是reload(),这个方法选择是否可以传递一个参数true;
如果location调用reload()方法不传递参数true,则浏览器会采用最有方式,在浏览器已有的缓存上加载当前页面,如果传递参数true,则浏览器会将当前页面全部重新加载不使用缓存;
location.reload();//重新加载(有可能从缓存中加载)
location.reload(true);//重新加载(页面所有内容重新从服务器获取);
推荐阅读
- JavaScript|JavaScript: BOM对象 和 DOM 对象的增删改查
- 前端|web前端dya07--ES6高级语法的转化&render&vue与webpack&export
- JS/JavaScript|JS/JavaScript CRC8多项式 16进制
- JS|VUE学习笔记[30-46]
- 腾讯TEG实习|腾讯实习——Vue解决跨域请求
- 地图|高德地图清除指定覆盖物 自定义覆盖物样式(完整dome)
- Pyecharts|Pyecharts 猎聘招聘数据可视化
- flex|C语言-使用goto语句从循环中跳出
- 学习心得|Android 属性动画详解
- HTML+Js实战项目|在网页中实现icon小图标的几种方法