window对象方法之setTimeout(),setInterval()-程序员宅基地

window中的这两个方法是比较重要的，在许多的设计中会使用到这两个方法。比如使用在倒计时抢购中。

首先来说说这两个方法的用法吧！

一：window.setTimeout();

setTimeout() 方法用于在指定的毫秒数后调用函数或计算表达式。 //延迟几秒以后执行代码，并且只执行一次

语法：

setTimeout(code,millisec);

例子：两秒后，弹出“hello js”；

 
  1  第一个参数 我们要执行的代码 或则 一个函数
  2  第二个参数  毫秒数
第一种写法 （直接写 js 代码）
window.setTimeout("alert('hello js')",2000);


第二种写法   先书写函数
function sayHello(){
   
   alert('Hello JS');
}
window.setTimeout(sayHello,2000);


第三种写法  写匿名函数
window.setTimeout(
    function sayHello(){
   
       alert('hello js');
   }
,2000);


//第四种写法

function sayHello(){
   
   alert('Hello JS');
}

window.setTimeout('sayHello()',2000);


二：window.setInterval() ;
setInterval() 方法可按照指定的周期（以毫秒计）来调用函数或计算表达式;//每隔几秒调用一次代码；
语法：

setTimeout(code,millisec);

注意：setInterval() 方法会不停地调用函数，直到 clearInterval() 被调用或窗口被关闭。由 setInterval() 返回的 ID 值可用作 clearInterval() 方法的参数。

例子：倒计时10秒；
界面：

<!DOCTYPE html>
<html>
<head lang="en">
    <meta charset="UTF-8">
    <title></title>
    <link rel="stylesheet" href="../css/time.css">
    <script type="text/javascript" src="../js/time.js"></script>
</head>
<body>
<button>点击开始</button>
<button>点击暂停</button>
<div>10</div>
</body>
</html>

View Code

div{
     
    width: 100px;
    height: 100px;
    margin: 10px 10px;
    background-color: aqua;
    color: black;
    font-size:50px;
    border: 1px blue solid;
    text-align: center;
    line-height: 100px;

}

View Code

window.οnlοad=function(){
    var div1=document.getElementsByTagName('div')[0];
    var btn=document.getElementsByTagName('button')[0];
    var btn1=document.getElementsByTagName('button')[1];
    btn.onclick=function(){
    time=  window.setInterval(function (){
        var num=parseInt(div1.innerHTML);
        if(num>0){
      //倒计时的数字需要大于0；
            num--;
            div1.innerHTML=num;
        }
    },1000);
    };
    btn1.onclick=function(){
        window.clearInterval(time);
    }

};

View Code

本文链接：https://blog.csdn.net/weixin_34253126/article/details/90196762

智能推荐

5个超厉害的资源搜索网站，每一款都可以让你的资源满满！_最全资源搜索引擎-程序员宅基地

文章浏览阅读1.6w次，点赞8次，收藏41次。生活中我们无时不刻不都要在网站搜索资源，但就是缺少一个趁手的资源搜索网站，如果有一个比较好的资源搜索网站可以帮助我们节省一大半时间！今天小编在这里为大家分享5款超厉害的资源搜索网站，每一款都可以让你的资源丰富精彩！网盘传奇一款最有效的网盘资源搜索网站你还在为找网站里面的资源而烦恼找不到什么合适的工具而烦恼吗？这款网站传奇网站汇聚了4853w个资源，并且它每一天都会持续更新资源；..._最全资源搜索引擎

Book类的设计(Java)_6-1 book类的设计java-程序员宅基地

文章浏览阅读4.5k次，点赞5次，收藏18次。阅读测试程序，设计一个Book类。函数接口定义：class Book{}该类有四个私有属性分别是书籍名称、价格、作者、出版年份，以及相应的set 与get方法；该类有一个含有四个参数的构造方法，这四个参数依次是书籍名称、价格、作者、出版年份。裁判测试程序样例：import java.util.*;public class Main { public static void main(String[] args) { List <Book>_6-1 book类的设计java

基于微信小程序的校园导航小程序设计与实现_校园导航微信小程序系统的设计与实现-程序员宅基地

文章浏览阅读613次，点赞28次，收藏27次。相比于以前的传统手工管理方式，智能化的管理方式可以大幅降低学校的运营人员成本，实现了校园导航的标准化、制度化、程序化的管理，有效地防止了校园导航的随意管理，提高了信息的处理速度和精确度，能够及时、准确地查询和修正建筑速看等信息。课题主要采用微信小程序、SpringBoot架构技术，前端以小程序页面呈现给学生，结合后台java语言使页面更加完善，后台使用MySQL数据库进行数据存储。微信小程序主要包括学生信息、校园简介、建筑速看、系统信息等功能，从而实现智能化的管理方式，提高工作效率。

有状态和无状态登录

传统上用户登陆状态会以 Session 的形式保存在服务器上，而 Session ID 则保存在前端的 Cookie 中；而使用 JWT 以后，用户的认证信息将会以 Token 的形式保存在前端，服务器不需要保存任何的用户状态，这也就是为什么 JWT 被称为无状态登陆的原因，无状态登陆最大的优势就是完美支持分布式部署，可以使用一个 Token 发送给不同的服务器，而所有的服务器都会返回同样的结果。有状态和无状态最大的区别就是服务端会不会保存客户端的信息。

九大角度全方位对比Android、iOS开发_ios 开发角度-程序员宅基地

文章浏览阅读784次。发表于10小时前| 2674次阅读| 来源TechCrunch| 19 条评论| 作者Jon EvansiOSAndroid应用开发产品编程语言JavaObjective-C摘要：即便Android市场份额已经超过80%，对于开发者来说，使用哪一个平台做开发仍然很难选择。本文从开发环境、配置、UX设计、语言、API、网络、分享、碎片化、发布等九个方面把Android和iOS_ios 开发角度

搜索引擎的发展历史

搜索引擎的发展历史可以追溯到20世纪90年代初，随着互联网的快速发展和信息量的急剧增加，人们开始感受到了获取和管理信息的挑战。这些阶段展示了搜索引擎在技术和商业模式上的不断演进，以满足用户对信息获取的不断增长的需求。

随便推点

控制对象的特性_控制对象特性-程序员宅基地

文章浏览阅读990次。对象特性是指控制对象的输出参数和输入参数之间的相互作用规律。放大系数K描述控制对象特性的静态特性参数。它的意义是：输出量的变化量和输入量的变化量之比。时间常数T当输入量发生变化后，所引起输出量变化的快慢。（动态参数） ..._控制对象特性

FRP搭建内网穿透(亲测有效)_locyanfrp-程序员宅基地

文章浏览阅读5.7w次，点赞50次，收藏276次。FRP搭建内网穿透1.概述：frp可以通过有公网IP的的服务器将内网的主机暴露给互联网，从而实现通过外网能直接访问到内网主机；frp有服务端和客户端，服务端需要装在有公网ip的服务器上，客户端装在内网主机上。2.简单的图解：3.准备工作：1.一个域名（www.test.xyz）2.一台有公网IP的服务器(阿里云、腾讯云等都行)3.一台内网主机4.下载frp，选择适合的版本下载解压如下：我这里服务器端和客户端都放在了/usr/local/frp/目录下4.执行命令# 服务器端给执_locyanfrp