Contoh -contoh dalam artikel ini berbagi dua efek hitung mundur untuk referensi Anda. Konten spesifiknya adalah sebagai berikut
Gambar reproduksi:
1. Efek hitung mundur
<! Doctype html> <html> <head> <meta charset = "utf-8"/> <itement> Countdown </iteme> <tautan rel = "stylesheet" href = "css/common.css" type = "text/css" charset = "UTF-8"/<gaya type = "css/css: 0; Padding: 0;} .dtime {margin: 10px;} .dtime span {color:#c30;} </style> </head> <body> <v id = "a1"> </div> <div id = "a2"> </div> <v id = "a3"> </div> <Div ID = "A4"> </Div> <v ID = "A3"> </Div> Div ID = "A4"> </Div> <v ID = "A3"> </DIV> <DIV ID = "A4"> </DIV> <v ID = "A3" fungsi tbdtimecountdown (args) {// fungsi hitung mundur var ele = document.geteLementById (args.id); var alltime = args.alltime; var arr = []; var t = math.floor (alltime/(24*60*60)); var yt = alltime%(24*60*60); var s = math.floor (yt/(60*60)); var ys = yt%(60*60); var f = math.floor (ys/(60)); var yf = ys%(60); var m = yf; arr [0] = [t, "day"]; arr [1] = [s, "jam"]; arr [2] = [f, "menit"]; arr [3] = [m, "akhir kedua"]; var s = Ce (arr, 0); ELE.InnerHTML = S; var dong; dong = setInterval (function () {alltime- = 1; if (alltime <= 0) {clearInterval (dong); ele.innerHtml = "<span> 0 </span> kedua"; args.end ();} else {t = math.floor (alltime/(24*60*60); yt eL lain {t = math.floor (alltime/alltime/24*60*60); yt = all-{t = math.floor (alltime/alltime/24*60*60); yt = yt = all-loor (alltime); S = FLOOR (YT/(60*60); S = CE (ARR, 0); fungsi ce (arr, sta) {var i = sta; if (i <arr.length) {if (arr [i] [0]! = 0) {var s = ""; untuk (var j = i; j <arr.length; j ++) {s+= "<span>"+arr [j] [0]+"</span>"+arr [j] [1]; }; kembali S; } else {return ce (arr, i+1); }; }; }; }; }; }; }; }; // Hitung mundur akhir // Efek 1 // 86402 3602 62 TBDTIMECOUNTDOWN ({ID: "A1", // Berisi Countdown Container Alltime: 3, // Total Countdown Detik Akhir: Function () {// Countdown End, Waktu 0 adalah fungsi yang dipanggil // peringatan ("Countdown berakhir!"); // Efek 2 TBDTimecountDown ({ID: "A2", // Berisi Wadah Countdown Alltime: 62, // Total Countdown Detik Akhir: Function () {// Countdown End, Waktu 0 adalah fungsi yang disebut},}); // Efek 3 TBDTimEcountDown ({ID: "A3", // Berisi Wadah Countdown Alltime: 3602, // Total Countdown detik akhir: function () {// countdown end, waktu 0 adalah fungsi yang disebut},}); // Efek 4 TBDTimecountDown ({ID: "A4", // Berisi Wadah Countdown Alltime: 86402,/Total Countdown detik akhir: function () {// countdown end, waktu 0 adalah fungsi yang disebut},}); // Efek 4 TBDTimecountDown ({ID: "A4", // Berisi Wadah Countdown Alltime: 86402,/Total Countdown detik akhir: function () {// countdown end, waktu 0 adalah fungsi yang disebut},}); // Efek 4 TBDTimecountDown ({ID: "A4", // Berisi Wadah Countdown Alltime: 86402,/Total Countdown detik akhir: function () {// countdown end, waktu 0 adalah fungsi yang disebut},}); // Efek 4 TBDTimecountDown ({ID: "A5", // Berisi Wadah Countdown Alltime: 154789, // Total Countdown detik akhir: function () {// ujung mundur, waktu 0 adalah fungsi yang disebut},}); </script> </html>2. Countdown 2.html
<! Doctype html> <html> <head> <meta charset = "utf-8"/> <itement> Countdown </iteme> <tautan rel = "stylesheet" href = "css/common.css" type = "text/css" charset = "UTF-8"/<gaya type = "css/css: 0; Padding: 0;} .dtime {margin: 10px;} .dtime span {color:#c30;} </tyle> </head> <body> <div id = "a1" alltime = "3"> </div> <div id = "a2" alltime = "62"> </div> <div id = "a3" "alltime =" 62 "> </Div> <div id id =" a3 " alltime = "48605"> </div> <div id = "a5" alltime = "123456"> </div> </body> <script> function tbdtimeCountdown (args) {// fungsi Countdown var ele = document.geteLementById (args.id); var alltime = number (eLe.getAttribute (args.alltime)); var arr = []; var t = math.floor (alltime/(24*60*60)); var yt = alltime%(24*60*60); var s = math.floor (yt/(60*60)); var ys = yt%(60*60); var f = math.floor (ys/(60)); var yf = ys%(60); var m = yf; arr [0] = [t, "day"]; arr [1] = [s, "jam"]; arr [2] = [f, "menit"]; arr [3] = [m, "akhir kedua"]; var s = Ce (arr, 0); ELE.InnerHTML = S; var dong; dong = setInterval (function () {alltime- = 1; ele.setAttribute (args.alltime, alltime); if (alltime <= 0) {clearinterval (dong); ele.innerHtml = "<span> 0 </span> detik"; args.end ();} lain {t = math.floor YT = Saudara (24*60*60); ARR [3] = M, "Ujung Kedua"]; fungsi ce (arr, sta) {var i = sta; if (i <arr.length) {if (arr [i] [0]! = 0) {var s = ""; untuk (var j = i; j <arr.length; j ++) {s+= "<span>"+arr [j] [0]+"</span>"+arr [j] [1]; }; kembali S; } else {return ce (arr, i+1); }; }; }; }; }; }; }; // Hitung Mundur // Efek 1 // 86402 3602 62 TBDTIMECOUNTDOWN ({id: "A1", // Berisi Wadah Countdown Alltime: "Alltime", // Total Countdown Detik Akhir: Function () {// Countdown End, Waktu 0 adalah fungsi yang disebut fungsi ("Hitung mundur akan dieksekusi!" // Efek 2 TBDTimecountDown ({ID: "A2", // berisi wadah hitung mundur Alltime: "Alltime", // Total Countdown detik akhir: function () {// countdown end, waktu 0 adalah fungsi yang disebut},}); // Efek 3 TBDTimecountDown ({ID: "A3", // Berisi Wadah Countdown Alltime: "Alltime", // Total Countdown Detik Akhir: Function () {// Countdown End, Time 0 adalah fungsi yang disebut},}); // Efek 4 TBDTimecountDown ({id: "A4", // Berisi Wadah Countdown Alltime: "Alltime", // Total Countdown Detik End: Function () {// Countdown End, Time 0 adalah fungsi yang disebut},}); // Efek 4 TBDTimEcountdown ({ID: "A5", // Berisi Wadah Countdown Alltime: "Alltime", // Total Countdown Detik Akhir: Function () {// Countdown End, Time 0 adalah fungsi yang disebut},}); </script> </html>Anda dapat merujuk pada topik khusus "ringkasan fungsi hitung mundur JS" untuk studi mendalam.
Di atas adalah semua tentang artikel ini, dan saya harap akan sangat membantu bagi semua orang untuk mempelajari pemrograman JavaScript.