一个例子

Doigt_love

于 2016-08-31 15:38:22 发布

阅读量306

点赞数

分类专栏： javascript 文章标签： js实现页面自动跳转

本文链接：https://blog.csdn.net/Doigt_love/article/details/52385728

版权

javascript 专栏收录该内容

7 篇文章 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;
就取不到值，报错是