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ù)用以顯示當前時間
function displayTime() {
var elt = document.getElementById("clock"); // 通過id= "clock"找到元素
var now = new Date(); // 得到當前時間
elt.innerHTML = now.toLocaleTimeString(); //讓elt來顯示它
setTimeout(displayTime,1000); //在1秒后再次執(zhí)行
}
window.onload = displayTime; //當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)容對大家的學習或者工作能帶來一定的幫助，同時也希望多多支持腳本之家！
相關(guān)文章
本篇文章主要介紹了淺談ES6 模板字符串的具體使用方法，小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2017-11-11
這篇文章主要介紹了JavaScript中的常用算法與函數(shù)。需要的朋友可以過來參考下，希望對大家有所幫助2013-11-11
這篇文章主要給大家介紹了關(guān)于js獲取dom元素寬高的幾種方法,文中通過示例代碼介紹的非常詳細,對大家學習或者使用js具有一定的參考學習價值,需要的朋友可以參考下2023-08-08
這篇文章主要為大家詳細介紹了十大熱門的JavaScript框架和庫，前端必備，感興趣的小伙伴們可以參考一下2017-03-03
JS中數(shù)組與對象相互轉(zhuǎn)換的實現(xiàn)方式
這篇文章主要介紹了JS中數(shù)組與對象相互轉(zhuǎn)換的實現(xiàn)方式，文章通過代碼示例講解的非常詳細，對大家的學習或工作有一定的幫助,需要的朋友可以參考下2024-04-04
最近在學Javascript，花了半個月的時間終于把《Javascript權(quán)威指南》(推薦此書，入門級) 掃完。 在學習的過程中發(fā)現(xiàn)使用JS實現(xiàn)動態(tài)效果挺有趣的。2008-11-11
本地存儲cookie、localStorage和sessionStorage示例詳解
cookie、localStorage?和?sessionStorage都是在客戶端存儲數(shù)據(jù)的方式，但它們之間有一些區(qū)別,下面這篇文章主要給大家介紹了關(guān)于JavaScript中cookie、localStorage和sessionStorage的相關(guān)資料,需要的朋友可以參考下2024-03-03
這篇文章主要介紹了BootStrap 實現(xiàn)各種樣式的進度條效果,代碼分為動態(tài)和疊加兩種效果，需要的朋友可以參考下2016-12-12
JS實現(xiàn)滾動觸底的思路與代碼(附PC端滾動分頁加載數(shù)據(jù))
Javascript實現(xiàn)當頁面滾動到底部時觸發(fā)加載事件,可以通過監(jiān)聽窗口的滾動事件,同時判斷當前滾動條的位置和文檔總高度來實現(xiàn)該功能,這篇文章主要給大家介紹了關(guān)于JS實現(xiàn)滾動觸底的思路與代碼,文中還附PC端滾動分頁加載數(shù)據(jù),需要的朋友可以參考下2024-06-06
這篇文章主要介紹了javascript中如何快速獲取數(shù)組最后一個值問題,具有很好的參考價值,希望對大家有所幫助,如有錯誤或未考慮完全的地方,望不吝賜教2024-01-01