时钟效果(计时器)

JavaScript的时间对象:

var myTime = new Date();  //当前时间(计算机读取到此代码时系统的时间对象)

该对象上获取的详细时间都是number类型:

    myTime.getFullYear(); //获取年

    myTime.getMonth(); //获取(从0开始要+1)

    myTime.getDate(); //获取日

    myTime.getDay(); //获取星期(0-6的数字,代表星期日到星期六)

    myTime.getHours(); //获取时

    myTime.getMinutes(); //获取分

    myTime.getSeconds(); //获取秒

把当前时间做一个拼接: iYear +'年/'+iMonth+'月/'+iDate+'日 '+iWeek+' '+iHours+':'+iMin+':'+iSec;

通常时间格式中时分秒应该是两位数,因此需要把所有的时分秒个位数前面补'0',如果当前的数字小于10则变成'0'+当前值,并统一成字符串

  • 利用计时器做出时钟时间:

DOM中文档结构如下:

<p></p>

JS中的样式如下:

var oP = document.getElementsByTagName("p")[0];
oP.innerHTML = getnowTime();
setInterval(function(){
oP.innerHTML = getnowTime();
},1000)//每隔一秒时间刷新一次

调用封装好的函数:

//每秒钟重新获取当前时间
function getnowTime(){
var myTime = new Date();
return adz(myTime.getHours())+":"+adz(myTime.getMinutes())+":"+adz(myTime.getSeconds());	
}
//判断数字是否大于0,小于时前加0
function adz(num){
return num>10 ? num:"0"+num;
}

效果图如下:


隔几秒之后:



猜你喜欢

转载自blog.csdn.net/number7421/article/details/80317069
今日推荐