html页面自动跳转的2种方法 meta 与js和其跳转优先级

最新推荐文章于 2025-03-31 17:03:29 发布

原创最新推荐文章于 2025-03-31 17:03:29 发布

· 1k 阅读

1 ·

版权

文章标签：

#javascript #html #前端 #页面自动跳转 #链接自动跳转 #html5自动跳转

前端创享空间站专栏收录该内容

19 篇文章

订阅专栏

本文介绍了在HTML网页开发中使用<meta>标签刷新和JavaScript的window.location.href进行页面自动跳转的方法，包括核心代码示例和适用场景。

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

web html网页开发的时候我们经常用到html页面自动跳转, 常用的跳转方式有2种一种是通过html的meta标签刷新，另外一种是通过JS代码。 meta方式可用于无JS支持的页面自动跳转，优先级低于JS的跳转方式。

meta标签刷新自动跳转

核心代码就是在head之间加入代码 <meta http-equiv="refresh" content="0;url=你要跳转到的URL地址"> 即可

完整示例

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Loading......</title>
	<meta http-equiv="refresh" content="0;url=https://dev.tekin.cn/?ref=csdn">
</head>
<body style="margin:0;background-color:black">
</body>
</html>

js window.location方式跳转

在head之间插入JS代码 <script language="javascript" type="text/javascript">
window.location.href="你要跳转到的URL地址";</script>

完整示例：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Loading......</title>
<script language="javascript" type="text/javascript">
window.location.href="https://dev.tekin.cn?ref=csdn";
</script>
</head>
<body style="margin:0;background-color:black">
</body>
</html>