js小案例----距離某一天還剩多少天


距離某一天還剩多少天,JS案例,其實挺簡單的,但我卡在某個地方了,好久才想明白

這里面有個需要將毫秒數轉化為天時分秒的過程,莫名其妙的卡在了這里,我真是太笨了;

function mschange(num) {
    var num1 = parseInt(num / 1000);
    var miao = parseInt(num1 % 60);//
    var minute = parseInt((num1 / 60) % 60);//
    var hour = parseInt((num1 / 60 / 60) % 24);//小時
    var day = parseInt(num1 / 60 / 60 / 24);//
    return {
        'miao': miao,
        'minute': minute,
        'hour': hour,
        'day': day
    }
}

上面代碼是將毫秒轉化為天時分秒,一不小心卡在了這里,后來才想明白是單位的問題;好了以下是案例的完整代碼

 

 

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>09距離某個日期還有多少</title>
</head>

<body>
    <h1>09距離某個日期還有多少天</h1>
    <input type="date" id="end">
    <input type="button" value="點我" id="btn">
    <div id="output"></div>
</body>
<script>
    (function () {
        var btn = document.getElementById('btn');
        var end = document.getElementById('end');
        var output = document.getElementById('output');

        btn.onclick = function () {
            //需求:end時間 - 今天 = 毫秒數 -> 天數
            var endTime = end.value;
            var _endTime = Date.parse(endTime);
            var startTime = Date.now();//獲取到今天的紀元時間(到1970-1-1 零點的毫秒數)
            var res = _endTime - startTime;//毫秒數
            // var days = Math.ceil(res / 1000 / 60 / 60 / 24);
            // console.log(days);
            //年月日時分秒
            var times = mschange(res);

            console.log(times);
            output.innerHTML = `還剩:${times.day}天${times.hour}小時${times.minute}分${times.miao}秒`;
        }
function mschange(num) {
    var num1 = parseInt(num / 1000);
    var miao = parseInt(num1 % 60);//
    var minute = parseInt((num1 / 60) % 60);//
    var hour = parseInt((num1 / 60 / 60) % 24);//小時
    var day = parseInt(num1 / 60 / 60 / 24);//
    return {
        'miao': miao,
        'minute': minute,
        'hour': hour,
        'day': day
    }
}
    })();
</script>

</html>

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM