window.location 的几个用法（获取当前页面地址、页面跳转到指定链接、刷新页面）

最新推荐文章于 2024-10-11 00:00:00 发布

熊叁(san)

最新推荐文章于 2024-10-11 00:00:00 发布

阅读量1.1w

点赞数 1

分类专栏：前端笔记

本文链接：https://blog.csdn.net/littlebearGreat/article/details/78356868

版权

前端笔记专栏收录该内容

126 篇文章 2 订阅

订阅专栏

此为笔记，加深记忆

window.location对象包含当前页面的URL信息，我们可以对location进行操作，得到一些效果

1. location.herf 返回得到当前页面的地址

console.log(location.href);

2. 给location.herf 赋值新的链接字符串，会直接使页面跳转到该链接

location.href = 'https://www.baidu.com/';

3. location.reload() 刷新当前页面（重新加载当前页面）

location.reload(true);

注释：如果 reload() 中没有参数，当浏览器的缓存里保存了当前页面时，就会加载缓存的内容，为了避免这种情况发生，在调用 reload() 方法时添加参数 true

下面是代码：

<!DOCTYPE html>
<html>
<head>
	<meta charset="UTF-8">
	<title>window.location</title>
	<script src="../jquery.min.js"></script>
</head>
<body>
	<button class="getLocation">获得链接</button>
	<button class="changeLocation">跳转页面</button>
	<button class="reload">重新加载</button>
<script>
	$(function(){

		// location对象:当前加载页面的地址
		$('.getLocation').click(function(){
			console.log(location.href);
		});

		// 页面跳转到指定链接
		$('.changeLocation').click(function(){
			location.href = 'https://www.baidu.com/';
		})

		// 页面重新加载
		$('.reload').click(function(){
			location.reload(true);
		})

	})
</script>
</body>
</html>