setInterval和setTimeout中止的方法

时间 2019-11-12

标签 setinterval settimeout 中止方法繁體版

原文原文链接

1,HTML DOM setInterval() 方法
定义和用法
setInterval() 方法可按照指定的周期（以毫秒计）来调用函数或计算表达式。
setInterval() 方法会不停地调用函数，直到 clearInterval() 被调用或窗口被关闭。由 setInterval() 返回的 ID 值可用做 clearInterval() 方法的参数。
语法
setInterval(code,millisec[,"lang"])
参数描述
code 必需。要调用的函数或要执行的代码串。
millisec 必须。周期性执行或调用 code 之间的时间间隔，以毫秒计。
返回值
一个能够传递给 Window.clearInterval() 从而取消对 code 的周期性执行的值。
2,HTML DOM clearInterval()方法
定义和用法
clearInterval() 方法可取消由 setInterval() 设置的 timeout。
clearInterval() 方法的参数必须是由 setInterval() 返回的 ID 值。
语法
clearInterval(id_of_setinterval)
参数描述
id_of_setinterval 由 setInterval() 返回的 ID 值。css

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
 <head>
  <title> New Document </title>
  <meta name="Generator" content="EditPlus">
  <meta name="Author" content="珞珈网络科技有限公司-js打字机效果_js打字效果_setInterval中止方法">
  <meta name="Keywords" content="js打字机效果,js打字效果,setInterval中止方法">
  <meta name="Description" content="">
  <style type="text/css">
  #demo{font-family:宋体; font-size:14px; line-height:22px; background:#f5f5f5; color:#000;}
  </style>
 </head>

 <body>
  <p id="demo"></p>
  <script>
  var myVar="珞珈网络团队位于秀美的武汉大学珞珈山脚下，以武汉大学优秀的人才资源为依托为客户提供一流的建站服务和完善的售后保障...欢迎致电027-87860378与客服沟通洽谈，或访问咱们的官网http://www.luojianet.com/了解更多关于公司信息。";
    x=myVar.length;
    myArray=myVar.split("");
    i=0;
  var int;
  int=setInterval("shuchu()",100);
  function shuchu()
  {    
  document.getElementById('demo').innerHTML+=myArray[i++];
  if (i==x)
  {
  clearInterval(int);
  }
  }
  </script>
  </body>
</html>

1,HTML DOM setTimeout() 方法
定义和用法
setTimeout() 方法用于在指定的毫秒数后调用函数或计算表达式。
语法
setTimeout(code,millisec)
参数描述
code 必需。要调用的函数后要执行的 JavaScript 代码串。
millisec 必需。在执行代码前需等待的毫秒数。
提示和注释
提示：setTimeout() 只执行 code 一次。若是要屡次调用，请使用 setInterval() 或者让 code 自身再次调用 setTimeout()。
2,HTML DOM clearTimeout() 方法
定义和用法clearTimeout() 方法可取消由 setTimeout() 方法设置的 timeout。语法clearTimeout(id_of_settimeout)
参数描述
id_of_setinterval 由 setTimeout() 返回的 ID 值。该值标识要取消的延迟执行代码块。html

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
 <head>
  <title> New Document </title>
  <meta name="Generator" content="EditPlus">
  <meta name="Author" content="">
  <meta name="Keywords" content="">
  <meta name="Description" content="">
    <script>
    var myVar="珞珈网络团队位于秀美的武汉大学珞珈山脚下，以武汉大学优秀的人才资源为依托为客户提供一流的建站服务和完善的售后保障...欢迎致电027-87860378与客服沟通洽谈，或访问咱们的官网http://www.luojianet.com/了解更多关于公司信息。";
    myArray=myVar.split("");
    i=0;
    var t=1;
    function time()
    {
    document.getElementById('demo').innerHTML+=myArray[i++]+t;
    t=setTimeout("time()",1);
    if (i>=myVar.length)
    {
        clearTimeout(t);
    }
    }
    </script>
 </head>

 <body>
<button onclick="time()">开始</button>
<div id="demo"></div>
  </body>
</html>