我必须为即将到来的ICC板球世界杯赛事做一个倒计时页面，以下面的格式显示剩下的几天。
格式＃1：01个月10天10个小时
格式2：01小时20分10秒（如果剩余<2天）
以下代码就是我现在所拥有的。我如何解决这个问题，请帮忙：
body {
background-image: url("https://www.somersetcountycc.co.uk/wp-content/uploads/2018/09/getimage.png");
background-size: 100%;
}
.countdownContainer{
position: absolute;;
top: 50%;
left: 50%;
transform : translateX(-50%) translateY(-50%);
text-align: center;
background: rgba(221, 221, 221, 0.8);
border: 1px solid #999;
padding: 10px;
box-shadow: 0 0 5px 3px #ccc;
}
.info {
font-size: 50px;
}<!DOCTYPE html>
<html>
<head>
<title>ICC World cup 2019 countdown</title>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<table class="countdownContainer" id="mytable">
<tr class="info">
<td colspan="5">Countdown to ICC World Cup 2019:</td>
</tr>
<tr class="info">
<td id="months"></td>
<td id="days"></td>
<td id="hours"></td>
<td id="minutes"></td>
<td id="seconds"></td>
</tr>
<tr>
<td>Months</td>
<td>Days</td>
<td>Hours</td>
<td>Minutes</td>
<td>Seconds</td>
</tr>
</table>
<script type="text/javascript">
function countdown(){
let now = new Date();
let eventDate = new Date("May 30, 2019 15:00:00");
let currentTiime = now.getTime();
let eventTime = eventDate.getTime();
let remTime = eventTime - currentTiime;
let s = Math.floor(remTime / 1000);
let m = Math.floor(s / 60);
let h = Math.floor(m / 60);
let d = Math.floor(h / 24);
let mo = Math.floor(d / 30);
mo %= 30;
h %= 24;
m %= 60;
s %= 60;
mo = (mo < 10) ? "0"+mo : mo;
h = (h < 10) ? "0" + h : h;
m = (m < 10) ? "0" + m : m;
s = (s < 10) ? "0" + s : s;
if(d>2){
document.getElementById("months").textContent = mo;
document.getElementById("days").textContent = d;
document.getElementById("hours").textContent = h;
}
else{
document.getElementById("hours").textContent = h;
document.getElementById("minutes").textContent = m;
document.getElementById("seconds").textContent = s;
}
setTimeout(countdown, 1000);
}
countdown();
</script>
</body>
</html>我再次修改了代码......
这是我的解决方案！你将不得不使用Moment JS和Moment.js日期范围插件：qazxsw poi
在下面的示例中，它们是导入的，但您可以转到这些链接并查找CDN或库的缩小版本。
这里也是LIVE示例的代码框：https://github.com/codebox/moment-precise-range
https://codesandbox.io/s/98y5800y34
import moment from "moment";
import { preciseDiff } from "moment-precise-range-plugin";
function countdown() {
var now = new Date();
var eventDate = new Date(now.getFullYear(), 1, 23);
var currentTiime = now.getTime();
var eventTime = eventDate.getTime();
var remTime = eventTime - currentTiime;
var s = Math.floor(remTime / 1000);
var m = Math.floor(s / 60);
var h = Math.floor(m / 60);
var d = Math.floor(h / 24);
var starts = moment(eventDate);
var ends = moment(now);
var duration = moment.duration(ends.diff(starts));
var diff = moment.preciseDiff(starts, ends, true);
h %= 24;
m %= 60;
s %= 60;
h = h < 10 ? "0" + h : h;
m = m < 10 ? "0" + m : m;
s = s < 10 ? "0" + s : s;
if (d >= 2) {
document.querySelector(".info1").style.cssText = "display:none";
document.querySelector(".descrip1").style.cssText = "display:none";
document.getElementById("f1months").textContent = diff.months;
document.getElementById("f1days").textContent = diff.days;
document.getElementById("f1hours").textContent = diff.hours;
} else {
document.querySelector(".info2").style.cssText = "display:none";
document.querySelector(".descrip2").style.cssText = "display:none";
document.getElementById("days").textContent = d;
document.getElementById("hours").textContent = h;
document.getElementById("minutes").textContent = m;
document.getElementById("seconds").textContent = s;
}
// setTimeout(countdown, 1000);
}
countdown();