编程练习制作一个跳转提示页面：要求： 1. 如果打开该页面后，如果不做任何操作则5秒后自动跳转到一个新的地址 2. 如果点击“返回”按钮则返回前一个页面。...

最新推荐文章于 2021-09-20 21:09:51 发布

weixin_30258901

最新推荐文章于 2021-09-20 21:09:51 发布

阅读量211

点赞数

文章标签： javascript ViewUI

原文链接：http://www.cnblogs.com/yongbin668/p/5592726.html

版权

编程练习

制作一个跳转提示页面：

要求：

1. 如果打开该页面后，如果不做任何操作则5秒后自动跳转到一个新的地址，如课网主页。

2. 如果点击“返回”按钮则返回前一个页面。

效果:

注意: 在窗口中运行该程序时，该窗口一定要有历史浏览记录，否则"返回"无效果。

任务

第一步：先编写好网页布局，如下:

第二步：获取显示秒数的元素，通过定时器来更改秒数。

第三步：通过window的location和history对象来控制网页的跳转。

<!DOCTYPE html>
<html>
 <head>
  <title>浏览器对象</title>  
  <meta charset="utf-8"/>   
 </head>
 <body>
  <!--先编写好网页布局-->
  <h1>操作成功</h1>
  <span id="second">5</span>
  <span>秒后回到主页</span>
  <a href="javascript:back()">返回</a>
 
  <script type="text/javascript">  
    var num = document.getElementById("second").innerHTML;
   //获取显示秒数的元素，通过定时器来更改秒数。
    function count(){
        num--;
        document.getElementById("second").innerHTML=num;
        if(num == 1)
        {
            location.assign("http://www.baidu.com");
        }
    }
    setInterval("count()",1000);
   //通过window的location和history对象来控制网页的跳转。
   function back(){
       window.history.back();
   }
 </script> 
</body>
</html>

转载于:https://www.cnblogs.com/yongbin668/p/5592726.html

weixin_30258901

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
编程练习制作一个跳转提示页面：要求： 1. 如果打开该页面后，如果不做任何操作则5秒后自动跳转到一个新的地址 2. 如果点击“返回”按钮则返回前一个页面。...

编程练习制作一个跳转提示页面：要求：1. 如果打开该页面后，如果不做任何操作则5秒后自动跳转到一个新的地址，如课网主页。2. 如果点击“返回”按钮则返回前一个页面。效果:注意: 在窗口中运行该程序时，该窗口一定要有历史浏览记录，否则"返回"无效果。任务第一步：先编写好网页布局，如下:...
复制链接

扫一扫