js實現(xiàn)一個簡單的數(shù)字時鐘效果
更新時間：2017年03月29日 10:06:36 作者：bad丶小
本文主要介紹了js實現(xiàn)一個簡單的數(shù)字時鐘效果的示例代碼。具有很好的參考價值，下面跟著小編一起來看下吧
效果圖：
代碼如下：
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>一個簡單的數(shù)字時鐘</title>
<script type="text/javascript" charset="utf-8">
// 定義一個函數(shù)用以顯示當(dāng)前時間
function displayTime() {
var elt = document.getElementById("clock"); // 通過id= "clock"找到元素
var now = new Date(); // 得到當(dāng)前時間
elt.innerHTML = now.toLocaleTimeString(); //讓elt來顯示它
setTimeout(displayTime,1000); //在1秒后再次執(zhí)行
}
window.onload = displayTime; //當(dāng)onload事件發(fā)生時開始顯示時間
</script>
<style type="text/css" media="all">
#clock {
font: bold 24pt sans;
background: #ddf;
padding: 10px;
border: 2px solid black;
border-radius: 10px;
}
</style>
</head>
<body>
<h1>一個簡單的數(shù)字時鐘</h1>
<span id="clock"></span>
</body>
</html>
以上就是本文的全部內(nèi)容，希望本文的內(nèi)容對大家的學(xué)習(xí)或者工作能帶來一定的幫助，同時也希望多多支持腳本之家！
相關(guān)文章
JavaScript callback回調(diào)函數(shù)用法實例分析
這篇文章主要介紹了JavaScript callback回調(diào)函數(shù)用法,結(jié)合實例形式分析了callback回調(diào)函數(shù)的概念、功能、應(yīng)用場景及相關(guān)使用技巧,需要的朋友可以參考下2018-05-05
fileupload控件 文件類型客戶端驗證實現(xiàn)代碼
客戶端JS驗證fileupload控件，設(shè)置只允許特定的文件類型 ，當(dāng)然服務(wù)器端更要判斷啊。這里是為了后臺驗證的更順利。2009-11-11
JavaScript中如何跳出forEach循環(huán)代碼示例
循環(huán)遍歷一個元素是開發(fā)中最常見的需求之一,下面這篇文章主要給大家介紹了關(guān)于JavaScript中如何跳出forEach循環(huán)的相關(guān)資料,文章通過代碼介紹的非常詳細(xì),需要的朋友可以參考下2024-06-06
JavaScript 是一種強大但被誤解的語言。關(guān)于它到底是一種面向?qū)ο蟮恼Z言還是函數(shù)式語言，人們眾說紛紜——但是現(xiàn)在讓我們把這些爭辯都拋到腦后。2014-07-07
關(guān)于JavaScript的gzip靜態(tài)壓縮方法
關(guān)于JavaScript的gzip靜態(tài)壓縮方法...2007-01-01
這篇文章主要為大家詳細(xì)介紹了JavaScript如何實現(xiàn)當(dāng)文本內(nèi)容過長時,中間顯示省略號...,兩端正常展示,有需要的小伙伴可以跟隨小編一起學(xué)習(xí)一下2024-02-02
JavaScript實現(xiàn)將網(wǎng)頁加入收藏夾功能
瀏覽器出于安全和隱私的考慮,限制了用代碼將網(wǎng)頁加入瀏覽器的收藏夾,本文主要介紹了如何使用通過一些間接的方法實現(xiàn)這一功能,有需要的可以參考下2024-10-10
這篇文章主要為大家詳細(xì)介紹了js實現(xiàn)電子時鐘功能，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下2022-06-06
這篇文章主要介紹了JSON與js對象序列化,結(jié)合實例形式詳細(xì)分析了JavaScript與JSON序列化操作的相關(guān)實現(xiàn)技巧與注意事項,需要的朋友可以參考下2017-03-03
Bootstrap，來自 Twitter，是目前最受歡迎的前端框架。本文給大家介紹路徑分頁標(biāo)簽與徽章組件，感興趣的朋友一起學(xué)習(xí)吧2016-04-04