专栏首页前端资源实现网页自动跳到其他页面的几种方法

实现网页自动跳到其他页面的几种方法

某些时候我们需要实现网页的自动跳转,比如404错误页可以加入代码让它自动跳转到首页,下面介绍三种html页面自动跳转的方法。

方法一:页面在头部加入meta标签 在头部加入 <meta http-equiv="refresh" content="时间/s;url=网址/http://www.dblog.cc">

代码如下: 

<html>
<head>
    <meta charset="UTF-8">
    <title>html自动跳转</title>
    <meta http-equiv="refresh" content="3;url=http://www.dblog.cc">
</head>
<body>

</body>
</html>

方法二:script实现自动跳转 第一种:比较常用:window.location.href = "http://baidu.com/";

代码如下:

<html>
<head>
    <title>html自动跳转</title>
</head>
<body>
<script>
    document.location = 'http://www.w3h5.com'
</script>
</body>
</html>

第二种:

self.location = "http://baidu.com/";

第三种:

top.location = "http://baidu.cn/";

第四种:只对IE系列浏览器有效,实用性不大。

window.navigate("http://baidu.cn/");

方法三:PHP实现

<?php
    header("Location: http://baidu.cn/");
?>

方法四:动态显示的自动跳转代码(比较复杂,不推荐)

<html>
<head>
    <meta charset="UTF-8">
    <title>html自动跳转</title>
</head>
<body>
<form name=loading>
    <p align=center>
        <font color="#0066ff" size="2">正在跳转,请稍等</font><font color="#0066ff" size="2" face="Arial">...</font>
        <input type=text name=chart size=46
               style="font-family:Arial; font-weight:bolder; color:#0066ff; background-color:#fef4d9; padding:0px; border-style:none;">
        <input type=text name=percent size=47
               style="color:#0066ff; text-align:center; border-width:medium; border-style:none;">
        <script>
            var bar = 0
            var line = "||"
            var amount = "||"
            count()

            function count() {
                bar = bar + 2
                amount = amount + line
                document.loading.chart.value = amount
                document.loading.percent.value = bar + "%"
                if (bar < 99) {
                    setTimeout("count()", 100);
                }
                else {
                    window.location = "http://www.dblog.cc";
                }
            }
        </script>
    </p>
</form>
<p align="center"> 如果您的浏览器不支持跳转,
    <a style="text-decoration: none" href="http://www.dblog.cc">
        <font color="#FF0000">请点这里</font>
    </a>.
</p>
</body>
</html>

本文参与腾讯云自媒体分享计划,欢迎正在阅读的你也加入,一起分享。

我来说两句

0 条评论
登录 后参与评论

相关文章

  • 从模版方法模式到 SPI 演变 :好的思想通用而持久

    一般情况下,我们会通过 API 对外提供服务。这里,API 提供服务的接口的逻辑是固定的,换句话说,它具有通用性。但是,但我们遇到具有类似的业务逻辑的场景时,即...

    用户2781897
  • 如何用PowerBI自定义函数批量爬取财务报表

    近期,学习了马老师的商业智能财务分析(PowerBI)课程后,不免手痒,教学中的案例数据不过瘾,于是在PowerBI学友的启发下,自己找现实数据玩了起来。那么今...

    公众号PowerBI大师
  • 如何筛选特征?用随机森林(RF)

    一般情况下,数据集的特征成百上千,因此有必要从中选取对结果影响较大的特征来进行进一步建模,相关的方法有:主成分分析、lasso等,这里我们介绍的是通过随机森林来...

    机器学习AI算法工程
  • 3.2.2 、Google Tag Manager实战指南——第三方代码部署

    第三方代码的部署方式有两种,一种是采用内置模板的方式,一种是采用自定义HTML的形式,下面以部署Adroll再营销代码作为例子,首先登陆Adroll去获取跟踪代...

    GA小站
  • Flask 静态文件、模板文件设置

    在Django项目中,如果需要访问静态文件,默认则是使用 /static 的前缀来进行访问。那么对于Flask来说,也是一样的。

    Devops海洋的渔夫
  • Python 3 既是激进的又是克制的,这些提议被否决了

    导语:Python 3.8 已经发布了,引进了不少变更点。关于 3.9 预计引入的修改,也披露了一些。我们之前还关注过 GIL的移除计划 和 Guido 正在开...

    Python猫
  • centos 7以上版本安装vmtools时提示kernel 路径问题

    Vsphere是通过VMTOOLS来实时监控管理虚机的,在centos7以上版本中会自带open-vm-tools工具,我们需要把这个组件卸载掉,然后安装vsp...

    孙杰
  • 2.4.1、Google Analytics高级应用——查看页面上下级

    在GA中查看上下级页面有默认参数:先前页面路径和后续页面路径,但出来的结果往往是前后相等的,错误的,如图2-48所示:

    GA小站
  • 令人惊叹的前端路由原理解析和实现方式

    ? 在单页应用如此流行的今天,曾经令人惊叹的前端路由已经成为各大框架的基础标配,每个框架都提供了强大的路由功能,导致路由实现变的复杂。想要搞懂路由内部实现还是...

    腾讯技术工程官方号
  • linux代理设置

    有些局域网环境上网需要使用代理上网,图形界面的很好解决就设置一下浏览器的代理就好了,但是Linux纯命令行的界面就需要手动配置了。

    孙杰

扫码关注云+社区

领取腾讯云代金券