JS（个人改进与注释版）：Date函数，当前时间，时钟，倒计时，十六进制，数组，随机
案例:通过Date函数写一个得到当前时间的函数，格式为“2222年 02月11日 11:09:01 星期“
2.案例:将上个例子改写为一个时钟
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<script>
window. onload=function(){
// setInterval() 方法可按照指定的周期（以毫秒计，1秒等于1000毫秒）来调用函数或计算表达式。
//
//setInterval() 方法会不停地调用函数，直到 clearInterval() 被调用或窗口被关闭。由 setInterval() 返回的 ID 值可用作 clearInterval() 方法的参数。
setInterval(shiZhongFunction,1000);}
function shiZhongFunction(){
var dangQian=new Date();//得到 当前的时间
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();//得到分钟数人
var miao=dangQian. getSeconds();//得到秒
var divJieMianVar=document . getElementById("divJieMian");
//innerHTML 属性设置或返回表格行的开始和结束标签之间的 HTML。
//
//语法:
//tablerowObject.innerHTML=HTML
divJieMianVar. innerHTML="当前时间为"+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(){//执行倒计时的方法
if(i==0){
alert("倒计时结束，"+"倒计时还有"+i+"秒");
zanTing();
}
var div1=document . getElementById("div1");
div1. innerHTML="倒计时还有"+i+"秒";
i--;
}
var jieshou=null;//用来判断倒计时是否暂停的变量
function start(){//开始倒计时
if(jieshou==null){
jieshou=setInterval(daoJishiFunction, 1000);//每一秒执行一次，按按钮的时间也会被算进去
}}
//用户点击了暂停的时候清空掉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.写一个函数，使用Math产生一个十六进制的颜色值，写十六进制内容的数组，生成随机颜色
<!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(){
//下面是声明了一个数组存储16进制中的内容：
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位数
str+=shuZhu[parseInt(Math. random()*shuZhu. length)];
}
//用alert测试一下生产的随机值对不对
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>
