<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="Generator" content="EditPlus®">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
<title>动态时钟</title>
<style>
p{
font-family: "楷体";
font-weight: bold;
font-size: 30px;
}
</style>
</head>
<body style="background-color:#FFEFD5">
<div style="border: 1px #B0C4DE solid;border-radius:10px;width: 500px;">
<p>您好,欢迎使用网页时钟!</p>
<p id="clock"></p>
</div>
</body>
<script src="http://ajax.aspnetcdn.com/ajax/jQuery/jquery-1.8.0.js" type="text/javascript"></script>
<script type="text/javascript">
//代码部分
$(document).ready(function(){
setInterval(function(){
$("#clock").html("");
var date=new Date();
var month,dates,hours,min,seconds;
month=(date.getMonth()+1);
dates=date.getDate();
hours=date.getHours();
min=date.getMinutes();
seconds=date.getSeconds();
if(month<10){
month="0"+month;
}
if(dates<10){
dates="0"+dates;
}
if(hours<10){
hours="0"+hours;
}
if(min<10){
min="0"+min;
}
if(seconds<10){
seconds="0"+seconds;
}
week=new Array("星期日","星期一","星期二","星期三","星期四","星期五","星期六");
var clocks=date.getFullYear()+"年"+month+"月"+dates+"日"+hours+":"+min+":"+seconds+" "+week[date.getDay()];
$("#clock").append(clocks);
},1000)
})
</script>
</html>
jQuery实现一个简单的数字时钟
版权声明:本文为博主原创文章,未经博主允许不得转载。 https://blog.csdn.net/weixin_40969422/article/details/83239383
猜你喜欢
转载自blog.csdn.net/weixin_40969422/article/details/83239383
今日推荐
周排行