前端——实现时钟附带小例子

创建日期对象

toLocaleDateString() 获取日期

console.log(date.toLocaleDateString())

toLocaleTimeString() 获取时间

console.log(date.toLocaleTimeString())

toLocaleString() 获取日期和时间

console.log(date.toLocaleString())

date.getDay() 获取星期几周日为0 取值区间为0~6

date.getDate() 获取日

date.getMonth() 获取月 区间为0~11

date.getYear() 获取年

date.getTime() 获取时间 时间戳

例子运用

实现一个时钟（css自设）最终效果图如下

全部代码如下：

<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><meta name="viewport" content="width=device-width, initial-scale=1.0"><title>Document</title><script>window.onload=function(){var container=document.querySelector(".container")var start= new Date().getTime()var change=function(){var date= new Date()container.innerHTML=date.toLocaleString()var timer= setTimeout(change,1000)var end=date.getTime()if(end-start>1000*10){clearTimeout(timer)}}change()}</script><style>.container{margin: 50px auto;font-size: 100px;line-height: 400px;text-align: center;width: 60%;height: 400px;border: 50px rgb(204, 122, 28) dotted;background: linear-gradient(0deg,rgb(219, 197, 54),rgb(31, 192, 204));}</style>
</head>
<body><div class="container"></div>
</body>
</html>

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.rhkb.cn/news/432644.html

如若内容造成侵权/违法违规/事实不符，请联系长河编程网进行投诉反馈email:809451989@qq.com，一经查实，立即删除！