首页 >web前端 >html教程 > 正文

html如何实现页面跳转

原创2021-09-07 17:45:2101475

跳转方法:1、使用“<a href="网址">文本</a>”;2、使用“<meta http-equiv="refresh" content="秒数;url=网址">”;3、使用“window.location.href = '网址';”。

本教程操作环境:windows7系统、html5版,DELL G3电脑。

实现页面跳转的方法

1、HTML中A标签跳转

HTML中的A标签也可以看做为页面跳转的一种,只是通过鼠标点击的方式进入跳转

A标签跳转代码如下

<a href="http://www.feiniaomy.com"></a>

2、meta标签页面跳转

HTML页中,可以使用meta标签进入页面的跳转,此方法可以控制跳转的时间,以及自由化的定义跳转的网址

html跳转代码如下

<meta http-equiv="refresh" content="5;url=https://www.feiniaomy.com">

代码示图

微信截图_20210907164224.png

代码解释

看上在的代码,meta标签中有一个content属性,表示打开此页面后,多少秒后开启跳转。还有个URL属性,表示跳转的网址

3、javascript代码跳转

在网页利用js也可以实现页面的跳转或定时跳转

JS跳转代码如下

<script language="javascript" type="text/javascript">   
    // 以下方式直接跳转  
    window.location.href = 'https://www.feiniaomy.com/';
    // 五秒以后再跳转
    setTimeout("javascript:location.href='https://www.feiniaomy.com'", 5000);   
</script>

代码示图

微信截图_20210907164629.png

推荐学习:Html视频教程

以上就是html如何实现页面跳转的详细内容,更多请关注php中文网其它相关文章!

php中文网最新课程二维码

声明:本文原创发布php中文网,转载请注明出处,感谢您的尊重!如有疑问,请联系admin@php.cn处理

  • 相关标签:html
  • 相关文章

    相关视频


    网友评论

    文明上网理性发言,请遵守 新闻评论服务协议

    我要评论
  • 专题推荐

    作者信息
    推荐视频教程
  • HTML每日小知识(第二季)HTML每日小知识(第二季)
  • HTML 代码实例HTML 代码实例
  • 新独孤九贱之:HTML5极速入坑新独孤九贱之:HTML5极速入坑
  • HTML5前端面试题HTML5前端面试题
  • 视频教程分类