1、案例代码:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style>
#val{
border: 1px solid ;
height: 50px;
font-size: 25px;
}
</style>
</head>
<body>
<div id="val"></div>
<script>
var _val=document.getElementById("val");
// var date=new Date();
// var hours=date.getHours();
// var minute=date.getMinutes();
// var seconds=date.getSeconds();
function time(){
var date=new Date();
var hours=date.getHours();
var minute=date.getMinutes();
var seconds=date.getSeconds();
var xiaoshi=hours%12;
xiaoshi=xiaoshi<10?"0"+xiaoshi:xiaoshi;
minute=minute<10?"0"+minute:minute;
seconds=seconds<10?"0"+seconds:seconds;
if(hours>12){
_val.innerHTML=`今天是2022年6月15日 星期三 ${xiaoshi}:${minute}:${seconds} pm`;
}else{
_val.innerHTML=`今天是2022年6月15日 星期三 ${xiaoshi}:${minute}:${seconds} am`;
};
};
var id=setInterval("time()",1000);
</script>
</body>
</html>
2、实现效果: