Artikel ini membagikan kode implementasi waktu seluler JS untuk referensi Anda. Konten spesifiknya adalah sebagai berikut
Gambar reproduksi:
Kode Implementasi:
<! Doctype html> <html> <head> <title> js flow time </iteme> <style type = "text/css"> #divh, #divm, #divs {font-family: consal; Line-Height: 30px; Posisi: Absolute; Kiri: 0px; Lebar: 5760px; Warna: Putih; } #divh {latar belakang: #606; } #divm {latar belakang-warna: #060; } #divs {background-color: #006; } #divh div, #divm div, #divs div {float: left; Border-Right: Solid 1px Grey; Teks-Align: tengah; } </style> </head> <dig body> <div style = "font-family: arial; lebar: 400px; font-size: 24px;"> <div id = "divtime" style = "text-align: center; line-height: 1.5;"> Waktu; Div; <Div style = "outline: solid 5px gray; POSISI; id = "divh" style = "atas: 0px;"> </div> <div id = "divm" style = "Top: 30px;"> </div> <div id = "div" style = "Top: 60px;"> </div> <div id = "Divline" style = "Posisi: absolute; Top: 0px; 50%: 50%; </div> </div> <script type = "text/javaScript"> var divh = document.geteLementById ('divh'); var divm = document.geteLementById ('divm'); var divs = document.geteLementById ('divs'); var divtime = document.geteLementById ('divtime'); var aw = 2880; var ww = 400; var w = aw / 24; untuk (var i = 0; i <48; i ++) {var div = document.createElement ('div'); div.style.width = (w - 1) + 'px'; div.innerhtml = i % 24; Divh.AppendChild (Div); } w = aw / 60; untuk (var i = 0; i <120; i ++) {var div = document.createElement ('div'); div.style.width = (w - 1) + 'px'; div.innerhtml = i % 60; Divm.AppendChild (Div); } w = aw / 60; untuk (var i = 0; i <120; i ++) {var div = document.createElement ('div'); div.style.width = (w - 1) + 'px'; div.innerhtml = i % 60; Divs.AppendChild (Div); } window.setInterval (run, 20); fungsi run () {var dt = new date (); var h = dt.getHours (); var m = dt.getMinutes (); var s = dt.getSeconds (); var f = dt.getMilliseconds (); divh.style.left = ((h> 12)? 0: -aw) + ww / 2 + (h * -120) -m * 2 + 'px'; l = 0; Divm.style.left = ((m> 30)? 0: -aw) + ww / 2 + (m * -48) -s / 1.2 + 'px'; l = 0; divs.style.left = ((s> 30)? 0: -aw) + ww / 2 + (s * -48) -f * 48 /1000 + 'px'; divtime.innerHtml = 'waktu' + h + ':' + m + ":" + s; } </script> </body> </html>Di atas adalah semua tentang artikel ini, saya harap akan sangat membantu bagi semua orang untuk mempelajari pemrograman JavaScript.