时钟演示-CSDN博客

本文链接：https://blog.csdn.net/qq_44721518/article/details/113615048

运行的时钟
代码：

<!DOCTYPE html>
<html>
	<head>
		<meta charset="UTF-8">
		<title>运行的时钟</title>
		<style>
        input {
            font-size: 30px;
            color: #FFFFFF;
            background-color: yellowgreen;
            border: 8px double;
            text-align: center;
        }
	</style>
	</head>
	<body>
	    
		
		<input id="clock" size="30" type="text" value="">

<script type="text/javascript">
    function displayTime() {
        var data = new Date();
        var year = data.getFullYear();
        var month = data.getMonth()+1;
        var day = data.getDay();
		var hour = data.getHours();
		var min = data.getMinutes();
		var second = data.getSeconds();
		
			if(month <= 9)month ="0" + month;
		      
		    if(day <= 9)day = "0" + day;
		       
		    if(hour <= 9)hour = "0" + hour;
		      
		    if(min <= 9)min = "0" + min;
		      
		    if(second <= 9)second = "0" + second;
		document.getElementById("clock").value = year + "年" + month + "月" + day + "日" + ":"+ hour + ":" + min +":"+second;
    }

    window.onload = function () {
        /*设置定时器每隔1秒（1000毫秒），刷新时钟显示*/
        window.setInterval("displayTime( )", 1000);
    }
</script>
	
	</body>
</html>