js实现页面跳转的方式（bom内容）

最新推荐文章于 2022-08-02 09:09:42 发布

zhangli0421

最新推荐文章于 2022-08-02 09:09:42 发布

阅读量1k

点赞数

CC 4.0 BY-SA版权

文章标签： vue.js javascript 前端

本文链接：https://blog.csdn.net/zhangli0421/article/details/121467674

本文介绍了使用JavaScript进行页面跳转的方法，并提供了一个简单的参数传递示例，适用于前端开发人员，特别是关注Vue.js和JavaScript的开发者。代码示例中包含了haha.html页面的编写细节，如有疑问可留言讨论。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

第一种：(跳转到haha.html)
<script language="javascript" type="text/javascript">
        window.location.href="haha.html";
</script>
第二种：（返回上一页面）
<script language="javascript">
        window.history.go(-1);
</script>
第三种：
<script language="javascript">
        window.navigate("haha.html");
</script>
第四种：
<script language="JavaScript">
        self.location="haha.html";
</script>
第五种：
<script language="javascript">
        top.location="haha.html";
</script>

哈哈，自己要是不会用可以看代码：

这是你要的页面，里面还有简单的参数传递。自己可以看看。不会的可以留言哦。

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<body>
		<input type="button" id="btn" value="哈哈"  />
	</body>
	<script type="text/javascript">

		btn.onclick = function(){
			top.location="haha.html";
//			window.location.href ="https://www.baidu.com/";
//			window.location.href ="haha.html?id=1&name=666";
//			window.location.href ="haha.html#id=1&name=666";
			
		}
		
	</script>
</html>

在写一个haha.html页面代码如下：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title></title>
	</head>
	<body>
		<h2>回去了</h2>
		
	</body>
	<script type="text/javascript">
		document.querySelector("h2").onclick = function(){
			window.history.go(-1)
		}
		var x = window.location.href;
		var y = window.location.hash;
		console.log(x)
		console.log(y)
//		console.log(window.location.host)
		console.log(location.hostname)
		console.log(location.pathname)
		console.log(location.search)
		
	</script>
</html>