js implementiert einen einfachen Countdown
|
In diesem Artikelbeispiel wird der spezifische Code von js zur Implementierung eines einfachen Countdowns zu Ihrer Information geteilt. Der spezifische Inhalt ist wie folgt
Code:
<!DOCTYPE html>
<html lang="de">
<Kopf>
<meta charset="UTF-8">
<meta name="viewport" content="width=Gerätebreite, Anfangsmaßstab=1.0">
<title>Dokument</title>
<script src="./3. Füllen Sie Nullen auf, wenn weniger als 10.js vorhanden sind"></script>
<Stil>
div {
schweben: links;
Breite: 100px;
Höhe: 100px;
Hintergrundfarbe: #000;
Textausrichtung: zentriert;
Zeilenhöhe: 100px;
Farbe: #fff;
Schriftgröße: 30px;
Rand rechts: 10px;
}
</Stil>
</Kopf>
<Text>
<div></div>
<div></div>
<div></div>
<div></div>
<Skript>
var div = document.getElementsByTagName('div');
var inputTime = +new Date('2021-02-05 00:00:00'); //Die Gesamtzahl der Millisekunden von der Benutzereingabezeit bis zum 1. Januar 1970 setInterval(countTime, 1000);
Zeit zählen();
Funktion Zählzeit() {
var nowTime = +new Date(); //Gesamtzahl der Millisekunden von der aktuellen Zeit bis zum 1. Januar 1970 // console.log(timer);
var times = (inputTime - nowTime) / 1000; // Sekunden var d = parseInt(times / 60 / 60 / 24); // Tage div[0].innerHTML = addZero(d) + 'days';
var h = parseInt(Zeiten / 60 / 60 % 24) //div[1].innerHTML = addZero(h) + 'Zeit';
var m = parseInt(times / 60 % 60); //div[2].innerHTML = addZero(m) + 'Wert';
var s = parseInt(times % 60); //Sekunden div[3].innerHTML = addZero(s) + 'Sekunden';
}
</Skript>
</body>
</html>Das Obige ist der vollständige Inhalt dieses Artikels. Ich hoffe, er wird für jedermanns Studium hilfreich sein. Ich hoffe auch, dass jeder 123WORDPRESS.COM unterstützen wird. Das könnte Sie auch interessieren:
|
<<: Grafisches Tutorial zur Installation und Konfiguration von mysql 5.7.11 winx64.zip
>>: Detaillierte Erläuterung der Befehle zum Status und zur Leistung des Linux-Servers
Artikel empfehlen
jQuery implementiert das Bouncing-Ball-Spiel
In diesem Artikel wird der spezifische Code von j...
CentOS 6.5-Konfiguration: SSH-Anmeldung ohne Schlüssel zur Ausführung des PSSH-Befehls – Erläuterung
1. Überprüfen und installieren Sie pssh, yum list...
Mit CSS3 lässt sich ein umdrehbarer Hover-Effekt erzielen
CSS3 implementiert einen umdrehbaren Hover-Effekt...
Natives JS zur Implementierung eines atmenden Karussells
Heute zeige ich Ihnen ein mit nativem JS implemen...
Absatzlayout und Zeilenumbrüche in HTML-Webseiten
Das Erscheinungsbild einer Webseite hängt maßgebl...
Nodejs-Plugin und Nutzungsübersicht
Die Betriebsumgebung dieses Tutorials: Windows 7-...
Detaillierte grafische Erklärung der SQLMap-Injektion
Inhaltsverzeichnis 1. Wir haben festgestellt, das...
Implementierungsschritte zur Installation eines Redis-Containers in Docker
Inhaltsverzeichnis Redis auf Docker installieren ...
Tutorial zur Nginx-Standortkonfiguration von Grund auf
Grundlagen Die Reihenfolge der Standortübereinsti...
MySQL-String-Splitting-Beispiel (String-Extraktion ohne Trennzeichen)
String-Extraktion ohne Trennzeichen Fragenanforde...
Problemaufzeichnung bei der Verwendung des Vue+Echarts-Diagramms
Vorwort echarts ist mein am häufigsten verwendete...
So verwenden Sie Axios, um Netzwerkanforderungen in React Native zu stellen
In der Front-End-Entwicklung gibt es viele Möglic...
CSS transparenter Rahmen Hintergrund-Clip-Magie
In diesem Artikel wird hauptsächlich die wunderba...
So verwenden Sie vue-cli, um ein Projekt zu erstellen und es mit webpack zu verpacken
1. Bereiten Sie die Umgebung vor (laden Sie nodej...
Detaillierte Erläuterung des Beobachtermodus ausgehend von der Komponentenwertübertragung von Vue
Inhaltsverzeichnis Beobachtermuster Vue-Pass-Wert...