检查和输出的顺序问题
个人感觉可以把他理解成死循环,每次执行都最后,都会调用这个函数
document.getElementById("show").innerHTML=""+year+'年'+month+'月'+date+'日'+weekday[d]+h+':'+m+':'+s;
1、document拼写错了;
2、weekday[day]改成weekday[d];
有没有 timeShow 这个dom节点???
setTimeout(表达式,延时时间)在执行时,是在载入后延迟指定时间后,去执行一次表达式
setInterval(表达式,交互时间)则不一样,它从载入后,每隔指定的时间就执行一次表达式
由于部分浏览器支持时间格式不一样,所以有的不能识别
var endtime = new Date("2018-6-6");
例子中做了判断了,前提是差值>0,视频中没做判断是不严谨
用vs code吧
嗯 原来你是不加载啊 但是你有试过加引号和不加引号有什么区别吗 时间对的上吗
不一定要输出到指定位置吧,报错的是应该是showTime吧
var timedate=new Date('2018,2,16');//指的是2018年2月16日
var timedate=new Date(2018,2,16);//指的是2018年3月16日
并不是为了快速看到变化而已 , 这么写是为了正好对应本机时间一致好不好。 但每个人的理解不一样。你自己调成1000毫秒看看 ?效果 别人说的不一定是对的 ,自己多实践。
var timedate=new Date('2018,2,16');//指的是2018年2月16日
var timedate=new Date(2018,2,16);//指的是2018年3月16日
在JS里面,月份是0-11,对应月份1-12月
楼上那位朋友说的是对的,在这个函数里,i只是一个代表你将要传递给函数的参数,实际上你要传递给函数的参数是m和s。i只是代表一个被复制过来的参数值,并不是一个实际存在的变量。
如果你要写成i=(i<10)?("0"+i):i;那这个函数第一句你要先定义一个变量var i=i;这里代表的是你将你要传递给函数的参数先赋值给变量i。
//封装一个函数,来检查时分秒
function checkTime(i) {
// if (i < 10) {
// i = "0" + i;
// } else {
// return i;
// }
/*写法一:if语句后边不用再写一个else,直接把return i写在if语句外边,否则当m和s小于10的时候会报错。
if(i<10){
i="0"+i;
}
return i;
*/
//写法二:i=(i<10)?("0"+i):i;错误i未定义,为什么?
//写法二:var i=i; i=(i<10)?("0"+i):i; return i; 这么改就对了,但是实际上反而写复杂了,代码应该尽量写得简洁易懂。便于维护,写得太复杂会影响网页性能,看起来也不美观哈。
return (i<10)?("0"+i):i;
}
另外这个写法是三元表达式的写法,确实挺好用,你可以百度下。
原来是不能加[]
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>倒计时</title> <style type="text/css"> *{ padding: 0; margin: 0; } #box{ margin: 100px 500px; } .txtshow{ font:20px blod '微软雅黑'; color: purple; margin-bottom: 10px; } #timeShow,#timeNow{ font:30px blod '隶书'; color: red; background-color: #036; border: 2px solid purple; -moz-border-radius:6px; -webkit-border-radius:6px; border-radius: 6px; -moz-box-shadow:0 0 15px; -webkit-box-shadow:0 0 15px; box-shadow: 0 0 15px; } </style> <script type="text/javascript"> window.onload = function () { var t=setInterval(function () { var endtime= new Date("2017,7,18"), now= new Date(), oEndMonth=(endtime.getMonth()+1), oEndDate=endtime.getDate(), oEndHour=endtime.getHours(), oEndMinutes=endtime.getMinutes(), oEndSeconds=endtime.getSeconds(), nowMonth=(now.getMonth()+1), nowDate=now.getDate(), nowHour=now.getHours(), nowMinutes=now.getMinutes(), nowMinutes=nowMinutes<10?'0'+nowMinutes:nowMinutes, nowSeconds=now.getSeconds(), nowSeconds=nowSeconds<10?'0'+nowSeconds:nowSeconds; leftM=(oEndMonth-nowMonth);//这些变量不要用var就行了,作为全局变量 leftD=(oEndDate-nowDate); if (leftD<0) { leftD=leftD+30; leftM=leftM-1; } leftH=24+(oEndHour-nowHour); leftm=59+(oEndMinutes-nowMinutes); leftm=leftm<10?'0'+leftm:leftm; leftS=60+(oEndSeconds-nowSeconds); if (leftS==60) { leftS=0; leftm=leftm+1; } leftS=leftS<10?'0'+leftS:leftS; lefttime=leftM+'月'+leftD+'日'+leftH+':'+leftm+':'+leftS; // if (leftS==60) { // leftS="00"; // leftm=leftm+1; // } document.getElementById('timeShow').innerHTML=lefttime; document.getElementById('timeNow').innerHTML=nowHour+':'+nowMinutes+':'+nowSeconds; },500) } </script> </head> <body> <div id="box"> <div>距离考试还有<span id="timeShow"></span></div> <div>现在准确时间<span id="timeNow"></span></div> </div> </body> </html>
不存在任何兼容问题,所有浏览器都兼容。不用getTime() 可以用getDate。日期对象是全兼容的
那只是显示上感觉不出来,你可以打开调试工具(F12或者Ctel+Shift+C)你可以清楚的看到显示时间的方法的一秒钟被调用两次,而1000是只有一次。
1.可以换算为秒,不过使用的goTime()方法是返回1970年1月1日至今的毫秒数,转换为秒依然要除1000,像:
lefttime=parseInt((endtime.getTime()-newtime.getTime())/1000);//返回结束时间与当前时间的秒数
2.如果你是希望在获取时间时是直接获取秒,getSeconds()方法只能获取结束日期与当前日期的秒,不获取时分。
对上面两种回答不知道能否解决你的疑问(如果有你的代码就更好了)
lefttime 那里没有除以1000
var lefttime= parseInt((endtime.getTime() - nowtime.getTime())/1000);
=======================
完整代码:
function FreshTime()
{
var endtime=new Date("2018/10/1,12:20:12");//结束时间
var nowtime = new Date();//当前时间
var lefttime= parseInt((endtime.getTime() - nowtime.getTime())/1000);
d= parseInt(lefttime/(24*60*60)) ;
h= parseInt(lefttime/(60*60)%24);
m= parseInt(lefttime/60%60) ;
s= parseInt(lefttime%60) ;
document.getElementById("LeftTime").innerHTML=d+"天"+h+"小时"+m+"分"+s+"秒";
if(lefttime<=0){
document.getElementById("LeftTime").innerHTML="团购已结束";
clearInterval(sh);
}
}
FreshTime()
var sh;
sh = setInterval(FreshTime,500);
第10行,定义目标时间的时候,里面要加上引号
修改后如下
var timedate= new Date('2017,4,20');
setTimeout放在函数体中调用自己,就是递归,至于setInterval和setTimeout的优劣可以参考高程3的技巧一章
某些代码不可以在没有间断的情况连续重复执行。第一次调用函数,创建一个定时器,在指定的时间间隔之后运行代码。当第二次调用该函数时,它会清除前一次的定时器并设置另一个。如果前一个定时器已经执行过了,这个操作就没有任何意义。如果前一个定时器未执行,其实就是将其替换为一个新的定时器。目的是只有在执行函数的请求停止了一段时间之后才执行。
m=m.checkTime(m);
s=s.checkTime(s);
改成 直接m=checkTime(m),中间不需要m.
把day改为date试试
d= parseInt(leftime/(1000*24*60*60)) ; lefttime少了一个t
其他就没有看到了···
当然可以!
setTimeout(code,millisec) 用于在指定的毫秒数后调用函数或计算表达式。(也就是指执行一次)
setInterval(code,millisec) 方法可按照指定的周期(以毫秒计)来调用函数或计算表达式(也就是永远不停地执行下去, 直到 clearInterval() 被调用或窗口被关闭)
具体更详细的介绍可以去 W3scshool上
还是 编程练习中的代码,改变 onload中的代码,再把showTime()中的setTimeout()去掉 ,效果一样
<!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>当前系统时间</title> <link rel="stylesheet" href="style.css" /> <script type="text/javascript"> window.onload = function(){ setInterval(showTime); } function checkTime(i){ //补位处理 if(i < 10) return "0"+i; return i; } function showTime(){ var now=new Date(); var year= now.getFullYear() ; var month= now.getMonth() + 1 ; var day= now.getDay() ; var h= now.getHours() ; var m= now.getMinutes() ; var s= now.getSeconds() ; m=checkTime(m); s=checkTime(s); var weekday=new Array(7) weekday[0]="星期日" weekday[1]="星期一" weekday[2]="星期二" weekday[3]="星期三" weekday[4]="星期四" weekday[5]="星期五" weekday[6]="星期六" document.getElementById("show").innerHTML=""+year+"年"+month+"月"+day+"日 "+ weekday[day] +h+":"+m+":"+s; } </script> </head> <body> <div class="content1"> <div id="show">显示时间的位置</div> </div> </body> </html>
我个人的理解是,因为setTimeout是“等至少***ms才执行,且执行一次”,而不是“每隔***ms就执行(这是setInterval的功能)”。
根据w3school的说明,setTimeout本身是没有循环的功能的。它之所以能“循环”是因为被showTime在内部的最后调用了,而showTime在调用setTimeout之前运行的代码也是要花时间的,那如果我们假设showTime的代码比较长,需要600ms才执行完,那你设setTimeout是500ms的话,总时间就是600 + 500 >1000ms了。当然这里不需要600ms那么久,但setTimeout设成1000的话那时间间隔肯定大于1000ms的了。
参考资料:
http://www.w3school.com.cn/jsref/met_win_settimeout.asp
http://www.w3school.com.cn/jsref/met_win_setinterval.asp
http://www.phpweblog.net/rainman/archive/2009/01/05/6267.html
document.getElementById('timeShow').innerHTML = time";
innerHTML=time后面多了一个引号