先看效果
首先用到getTime方法来获取两者的时间戳。定义一个变量nowday用来接收当前的时间,newday接收目标时间,t 传入目标时间。t1 是获取当前时间距离默认时间(1970-1-1 0:0:0)的毫秒数,t2 是目标时间距离默认时间的毫秒数。
var nowday = new Date();
var newday = new Date(t);
var t1 = nowday.getTime();
var t2 = newday.getTime();
用户传入的目标时间可能是未来时间也可能是过去时间,当 t2 - t1 为正数时,说明是未来时间,同理负数是过去时间。这里可以用到Math.abs()方法,直接转化为正数。因为time1是毫秒,除于1000得到秒。
var time1 = (t2-t1) / 1000;
var time = Math.abs(time1);
time = (t2-t1) / 1000;
接下来就是通过计算得到现在时间距离目标日期还有(过去)**天**时**分**秒。这里用到三元表达式,用于规范格式:00天00时00分00秒。
var d = parseInt(time / 60 / 60 / 24);
d = d < 10 ? "0" + d : d
var h = parseInt(time / 60 / 60 % 24);
h = h < 10 ? "0" + h : h
var m = parseInt(time / 60 % 60);
m = m < 10 ? "0" + m : m
var s = parseInt(time % 60);
s = s < 10 ? "0" + s : s
接下来就是返回值,我们还可以对未来时间和过去时间进行判断,如果是未来时间则 “还有”,过去的就是 “已过去”。
str = newday.getFullYear()+"年"+(newday.getMonth()+1)+"月"+newday.getDate()+"日"+newday.getHours()+"时"+newday.getMinutes()+"分"+newday.getSeconds()+"秒"
if(time >= 0){
return "距离<br>"+str+"还有"+d+"天"+h+"时"+m+"分"+s+"秒"
}else{
return "距离<br>"+str+"已过去"+d+"天"+h+"时"+m+"分"+s+"秒"
}
最后打印一下当前时间。
function new_day(){
var d = new Date();
return (d.getFullYear()+"年"+(d.getMonth()+1)+"月"+d.getDate()+"日")
}
下面是全部代码。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
div{
width: 200px;
height: 200px;
margin: 0 auto;
border: solid 3px;
text-align: center;
box-shadow: 0px 0px 3px 1px yellow;
}
</style>
</head>
<body>
<script>
function cut(t){
var nowday = new Date();
var newday = new Date(t);
var t1 = nowday.getTime();
var t2 = newday.getTime();
var time1 = (t2-t1) / 1000;
var time = Math.abs(time1);
time = (t2-t1) / 1000;
var d = parseInt(time / 60 / 60 / 24);
d = d < 10 ? "0" + d : d
var h = parseInt(time / 60 / 60 % 24);
h = h < 10 ? "0" + h : h
var m = parseInt(time / 60 % 60);
m = m < 10 ? "0" + m : m
var s = parseInt(time % 60);
s = s < 10 ? "0" + s : s
str = newday.getFullYear()+"年"+(newday.getMonth()+1)+"月"+newday.getDate()+"日"+newday.getHours()+"时"+newday.getMinutes()+"分"+newday.getSeconds()+"秒"
if(time >= 0){
return "距离<br>"+str+"还有"+d+"天"+h+"时"+m+"分"+s+"秒"
}else{
return "距离<br>"+str+"已过去"+d+"天"+h+"时"+m+"分"+s+"秒"
}
}
function new_day(){
var d = new Date();
return (d.getFullYear()+"年"+(d.getMonth()+1)+"月"+d.getDate()+"日")
}
</script>
<div>
<h2>今天日期是</h2>
<p style="color: blue;">
<script>
document.write(new_day())
</script>
</p>
<p>
<script>
var input = prompt("输入目标时间:(例如:1970-1-1 0:0:0)")
document.write(cut(input))
</script>
</p>
</div>
</body>
</html>