您的位置：首页 > Web前端 > JavaScript

HTML、js：如何利用Location对象的常用属性和方法重新加载、刷新页面

2017-06-26 21:17 756 查看

在我的上一篇文章中主要介绍了window对象的常用属性和screen对象：点击打开链接点击此链接可以查看

Location对象也有一系列的属性：

hash：设置或返回从井号（#）开始的URL

host：设置或返回主机名和当前URL的端口号

hostname：设置或返回当前URL的主机名

href：设置或返回完整的URL

pathname：设置或返回当前URL的路径部分

port：设置或返回当前URL的端口号

protocol：设置或返回当前URL的协议

search：设置或返回从问号（？）开始的URL（查询部分）

Location对象的常用方法：

assign()：加载新的文档

reload()：重新加载当前文档

replace()：用新的文档替换当前文档

代码：

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Location对象</title>
</head>
<body>
<p>一二三四五六七</p>
<img src="" alt="">
<input type="button" id="a" value="点击刷新">
</body>
<script>
/*
var href=location.href;
var host=location.host;
alert(href)
alert(host)
*/
/*
//改变当前页面的url地址
location.href='https://www.baidu.com';
//简便写法
location='https://www.baidu.com';//页面跳转(运行时直接跳转到百度页面)
*/

window.onload=function () {

//手动刷新
var a=document.getElementById('a');

//添加点击事件
a.onclick=function () {

//手动刷新
location.reload()

//修改当前文档，作用类似location
location.replace('https://www.baidu.com')//点击刷新时，跳转到百度页面

location.assign('https://www.baidu.com')//点击刷新时，跳转到百度页面
}
}
</script>
</html>

内容来自用户分享和网络整理，不保证内容的准确性，如有侵权内容，可联系管理员处理

标签：

相关文章推荐

新的分享

章节导航