需要准备的材料分别有:电脑、html编辑器、浏览器。
1、首先,打开html编辑器,新建html文件,例如:index.html。
2、在index.html中的<script>标签,输入js代码:
var a = new Date()document.body.innerHTML
= '时:' + a.getHours() + '<br/>分:' + a.getMinutes() + '<br/>秒:' + a.getSeconds()
3、浏览器运行index.html页面,此时当前时间的时分秒都被js获取并打印了出来。
给你个思路:1初始化时间,例如1小时5分钟30秒(也可以让用户手动设置,这里略)
保存在全局变量中
var hour,minute,second
2设置定时每隔1秒执行function xxx
setInterval(function xxx(){...},1000)
3编写function用于每隔1秒更新时间,里面判断若倒计时为0时,隐藏div
function xxx(){
if(--second==0){
if(--minute==0){
if(--hour==0){
//隐藏div 设置style.display='none'
}
show(hour,minute,second)
second=60
minute=60
}
show(hour,minute,second)
second=60
}
show(hour,minute,second)
}
function show(hour,minute,second){
var str_hour = hour<10?"0"+hour:""+hour
var str_minute = minute<10?"0"+minute:""+minute
var str_second = second<10?"0"+second:""+second
//将这三个时分秒显示到div中指定位置
}
<html><head>
<title>setTimeout()</title>
<style type="text/css">
input
{
font-size:30px
border-style:none
background-color:#ff8b3b
}
</style>
</head>
<body onLoad="disptime()">
<form name="myform" >
<table width="100%" border="0" align=center>
<tr>
<td width="37%"> </td>
<td width="41%"><h2>当前时间:<input name="myclock" type="text" value=" " size="10"></h2></td>
<td width="22%"> </td>
</tr>
</table>
</form>
</body>
</html>
<script type="text/javascript">
function disptime()
{
var time=new Date()
var hour=time.getHours()
var minute=time.getMinutes()
var second=time.getSeconds()
document.myform.myclock.value=hour+":"+minute+":"+second+" "
var myTime=setTimeout("disptime()",1000)
}
</script>
我刚刚写的
欢迎分享,转载请注明来源:内存溢出
评论列表(0条)