javascript中的window對象的setTimeout使用

時間 2019-11-13

標籤 javascript window 對象 settimeout 使用欄目 JavaScript 简体版

原文原文鏈接

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
 <head>
  <title>window對象setTimeout</title>
  <meta name="Generator" content="EditPlus">
  <meta name="Author" content="">
  <meta name="Keywords" content="">
  <meta name="Description" content="">
	<style type="text/css">
		div{
			font-size:20px;
			font-weight:bold;
			font-family:Verdana, Geneva, sans-serif;
		}
	</style>
	<script language="javascript">
		var msg = new Array();//存放顯示文字數組
		msg.push("-----");
		msg.push("你知道嗎？");
		msg.push("-----");
		msg.push("若是生命沒有遺憾，沒有波瀾...");
		msg.push("------");
		msg.push("你會不會沒有說再見的那一天！");
		msg.push("離別嘎嘎嘎嘎嘎嘎");

		//根據數組個數生成對應個數的div
		for(i=0;i<=msg.length/2;i++){
			document.write("<div></div>");
		}
		var interval = 100;
		var seq=0;//顯示文字的位置
		var i=0,j=0;

		//打字效果顯示
		function Scroll(){
			if(i%2==0){
				document.getElementsByTagName("div").item(j).innerHTML=msg[i].substring(seq,seq+1);//顯示「-----」的第一個
			}else{
				document.getElementsByTagName("div").item(j).innerHTML=msg[i].substring(0,seq+1);
			}
			seq++;
			if(seq>msg[i].length){//所有顯示完一行的全部文字
				seq=0;
				i++;    //開始顯示msg的下一元素
				if(i%2==0) j++;//要顯示文字才換行
				interval=900;
			}
			if(i>=msg.length){  //所有顯示完全部行
				i=0;
				j=0;
				setTimeout("clearText()",2000);//文字顯示完畢後停2秒後清空
				return;
			}
			var timerScroll=setTimeout("Scroll()",interval);//0.1s定時執行
			interval=100;
		}

		function clearText(){
			for(k=0;k<(document.getElementsByTagName("div").length);k++){
				document.getElementsByTagName("div").item(k).innerHTML="";	
			}
			interval=100;
			Scroll();//循環顯示
		}
	</script>
 </head>

 <body onload="Scroll();" style="margin:20px 80px">
 </body>
</html>