บทความนี้แชร์รหัสการใช้งานของ JS Mobile Time สำหรับการอ้างอิงของคุณ เนื้อหาเฉพาะมีดังนี้
ภาพการทำซ้ำ:
รหัสการใช้งาน:
<! doctype html> <html> <head> <mheat> เวลาการไหลของ JS </title> <style type = "text/css"> #divh, #divm, #divs {font-family: connal; ระดับความสูง: 30px; ตำแหน่ง: สัมบูรณ์; ซ้าย: 0px; ความกว้าง: 5760px; สี: สีขาว; } #DIVH {พื้นหลังสี: #606; } #DIVM {พื้นหลังสี: #060; } #DIVS {พื้นหลังสี: #006; } #divh div, #divm div, #divs div {float: ซ้าย; ชายแดนขวา: สีเทาแข็ง 1px; TEXT-ALIGN: CENTER; } </style> </head> <body> <div style = "font-family: arial; width: 400px; font-size: 24px;"> <div id = "divtime" style = "text-allign: center; leight line: 1.5;"> time </div> id = "divh" style = "top: 0px;"> </div> <div id = "divm" style = "top: 30px;"> </div> <div id = "divs" style = "top: 60px;"> </div> <div id = "divline" </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; สำหรับ (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; สำหรับ (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; สำหรับ (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 (เรียกใช้, 20); ฟังก์ชั่นเรียกใช้ () {var dt = วันที่ใหม่ (); 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 = 'เวลา' + h + ':' + m + ":" + s; } </script> </body> </html>ข้างต้นเป็นเรื่องเกี่ยวกับบทความนี้ฉันหวังว่ามันจะเป็นประโยชน์สำหรับทุกคนในการเรียนรู้การเขียนโปรแกรม JavaScript