关闭

一个例子

标签: js实现页面自动跳转
56人阅读 评论(0) 收藏 举报
分类:
<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>zhizuo </title>

</head>
<body>
    <h2>操作成功</h2>
    <span id="time">5</span>
    <span>秒之后跳转到慕课网</span>
    <a href="#" id="back" title="返回慕课网">返回</a>  <!-- 方法一添加鼠标点击事件 -->
  <!--<a href="javascript:back()" id="back" title="返回慕课网">返回</a>  方法二-->
  <script type="text/javascript">
   var num=document.getElementById("time").innerHTML;   //要获取时间,得在秒数后面添加js代码,要不然num取不到值
  function dess(){                                         //num获取秒数
    num--;
    document.getElementById("time").innerHTML = num;      //秒数减少
    if(num==0){
     location.assign("http://www.imooc.com/");
    }
  }
  var i= setInterval("dess()",1000);
  var back =document.getElementById("back");   /*方法一添加鼠标点击事件*/
  back.onclick = function(){
    window.history.back();
  }
 /*function back(){      方法二添加js函数
  window.history.back();
 }*/
  </script>
</body>
</html>

我更习惯在代码里添加注释,这样日后再拿起来看就更方便。
要点一:
5 4 3 2 1 秒数的设置涉及到setInterval (function(){},毫秒数);函数,每过一秒就执行一个函数,这个函数让里面的数字减一,直到为0,这个函数就是dess();函数。
坑点:一开始我把写在了标签的上面,由于语句是按行读取的,在js中的var num=document.getElementById("time").innerHTML;
就取不到值,报错是

9999.html:7 Uncaught TypeError: Cannot read property ‘innerHTML’ of null

所以Js代码不是想写哪里就写哪里。
要点二:
在返回的那里我用了两种方法,一是不给herf,添加鼠标点击事件,二是给href添加一个函数javascript:back();实际上去掉javascript前缀也是一样,它只是一个标志。

0
0

猜你在找
【直播】机器学习&数据挖掘7周实训--韦玮
【套餐】系统集成项目管理工程师顺利通关--徐朋
【直播】3小时掌握Docker最佳实战-徐西宁
【套餐】机器学习系列套餐(算法+实战)--唐宇迪
【直播】计算机视觉原理及实战--屈教授
【套餐】微信订阅号+服务号Java版 v2.0--翟东平
【直播】机器学习之矩阵--黄博士
【套餐】微信订阅号+服务号Java版 v2.0--翟东平
【直播】机器学习之凸优化--马博士
【套餐】Javascript 设计模式实战--曾亮
查看评论
* 以上用户言论只代表其个人观点,不代表CSDN网站的观点或立场
    个人资料
    • 访问:4675次
    • 积分:351
    • 等级:
    • 排名:千里之外
    • 原创:32篇
    • 转载:2篇
    • 译文:0篇
    • 评论:0条
    文章分类