JS（個人改進與注釋版）：Date函數(shù)，當(dāng)前時間，時鐘，倒計時，十六進制，數(shù)組，隨機
案例:通過Date函數(shù)寫一個得到當(dāng)前時間的函數(shù)，格式為“2222年 02月11日 11:09:01 星期“
2.案例:將上個例子改寫為一個時鐘
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<script>
window. onload=function(){
// setInterval() 方法可按照指定的周期（以毫秒計，1秒等于1000毫秒）來調(diào)用函數(shù)或計算表達式。
//
//setInterval() 方法會不停地調(diào)用函數(shù)，直到 clearInterval() 被調(diào)用或窗口被關(guān)閉。由 setInterval() 返回的 ID 值可用作 clearInterval() 方法的參數(shù)。
setInterval(shiZhongFunction,1000);}
function shiZhongFunction(){
var dangQian=new Date();//得到 當(dāng)前的時間
var year=dangQian. getFullYear();//得到年份
var month=dangQian. getMonth()+1;//得到月份但是需要+1
var day=dangQian. getDate();//得到日
var zhouji=dangQian. getDay();//得到周幾(0代表周日)
var xiaoshi=dangQian . getHours();//得到小時24小時制
var fenzhong=dangQian . getMinutes();//得到分鐘數(shù)人
var miao=dangQian. getSeconds();//得到秒
var divJieMianVar=document . getElementById("divJieMian");
//innerHTML 屬性設(shè)置或返回表格行的開始和結(jié)束標(biāo)簽之間的 HTML。
//
//語法:
//tablerowObject.innerHTML=HTML
divJieMianVar. innerHTML="當(dāng)前時間為"+year+"年"+month+"月"+day+"日"+xiaoshi+":"+fenzhong+":"+miao;
}
</script>
</head>
<body>
<div id="divJieMian"></div>
</body>
</html>
3.案例:寫一個倒計時
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<script>
var i;
function daoJishiFunction(){//執(zhí)行倒計時的方法
if(i==0){
alert("倒計時結(jié)束，"+"倒計時還有"+i+"秒");
?zanTing();
}
var div1=document . getElementById("div1");
div1. innerHTML="倒計時還有"+i+"秒";
i--;
}
var jieshou=null;//用來判斷倒計時是否暫停的變量
function start(){//開始倒計時
if(jieshou==null){
jieshou=setInterval(daoJishiFunction, 1000);//每一秒執(zhí)行一次，按按鈕的時間也會被算進去
}}
//用戶點擊了暫停的時候清空掉jieshou
function zanTing(){//暫停倒計時
clearInterval(jieshou);
jieshou=null;
}
window . onload=function(){
i=prompt("請輸入倒計時的時間");
}
</script>
</head>
<body>
<div id="div1"></div>
<input type= "button" id= "btn1" value="開始倒計時"onclick= "start()" />
<input type= "button" id= "btn2" value="暫 停" onclick="zanTing()" />
</body>
</html>
4.寫一個函數(shù)，使用Math產(chǎn)生一個十六進制的顏色值，寫十六進制內(nèi)容的數(shù)組，生成隨機顏色
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<style>
#divSeKuai{width: 135px;height: 135px;border: 1px solid blue;
margin: 0 auto;
}
#button{
width: 135px;height: 20px;
border: 1px solid blue;
margin: 0 auto;
}
</style>
<script>
// suiJiYanSe: 隨機顏色
function suiJiYanSe(){
//下面是聲明了一個數(shù)組存儲16進制中的內(nèi)容：
var shuZhu=["0","1","2", "3", "4","5","6","7","8","9", "a", "b","c", "d","e","f"];
var str="#";//16進制最開始都要有一個#
for(var i=0;i<6;i++){//16進制都是6位數(shù)
str+=shuZhu[parseInt(Math. random()*shuZhu. length)];
}
//用alert測試一下生產(chǎn)的隨機值對不對
alert(str);
var divSeKuaivar=document. getElementById("divSeKuai");
divSeKuaivar. style . backgroundColor=str;
divSeKuaivar. innerHTML=str;
}
window. onload=function(){
suijiyanse();
}
</script>
</head>
<body>
<!-- divSeKuai：div矩形色塊-->
<div id="divSeKuai"></div>
<div id="button"><input type="button" value="點擊我切換div的顏色" onclick="suiJiYanSe()"/></div>
</body>
</html>
