【前端html+js】實現按下按鈕顯示當前時間(21位和中國國際時間)

html+js實現按下按鈕顯示當前時間(21位和中國國際時間)

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>時間</title>

    <!--獲取當前時間,格式爲:yyyy-mm-dd hh:mm:ss -->
    <script>
        getDates();
        function getDates(){
            //設置當前時間
            var date = new Date();
            var year = date.getFullYear();//月份從0~11,所以加一
            var dateArr = [date.getMonth() + 1,date.getDate(),date.getHours(),date.getMinutes(),date.getSeconds()];
            for(var i=0;i<dateArr.length;i++){
                if (dateArr[i] >= 1 && dateArr[i] <= 9) {
                    dateArr[i] = "0" + dateArr[i];
                }
            }
            var strDate = year+'-'+dateArr[0]+'-'+dateArr[1]+' '+dateArr[2]+':'+dateArr[3]+':'+dateArr[4];
            document.getElementById("dates").innerHTML = strDate;
        }
    </script>
    <!--中國國際時間-->
    <script>
        function displayDate_1(){
            document.getElementById("demo_1").innerHTML=Date();
        }
    </script>

</head>
<body>
 
<h1>上班打卡時間</h1>
<p id="dates">這裏顯示21位的時間</p>
 
<button type="button" onclick="getDates()">顯示日期</button>

<h1>下班打卡時間</h1>
<p id="demo_1">這裏顯示原格式時間</p>
 
<button type="button" onclick="displayDate_1()">顯示日期</button>
</body>
</html>

效果如下:

按下按鈕後效果如下:

 

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章