js implementiert einen einfachen Countdown

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:
  • JS-Countdown-Implementierungscode (Stunden, Minuten, Sekunden)
  • JS-Countdown (Tage, Stunden, Minuten, Sekunden)
  • Einfacher und leicht zu verwendender Countdown-JS-Code
  • js-Code zur Realisierung des 60-Sekunden-Countdowns beim Klicken auf die Schaltfläche
  • 2 einfache JS-Countdown-Methoden
  • Beispiel für die Implementierung einer einfachen Countdown-Funktion mit nativem JS
  • js Countdown-Sprungbeispiel nach ein paar Sekunden
  • Ein guter JS-HTML-Seiten-Countdown kann auf Sekunden genau sein
  • js realisiert den Countdown-Effekt des Klickens, um den Bestätigungscode zu erhalten
  • Javascript implementiert den Countdown für Produkt-Blitzverkäufe (Zeit wird mit der Serverzeit synchronisiert)

<<:  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

js-Methode zur Realisierung der Warenkorbberechnung

In diesem Artikelbeispiel wird der spezifische Co...

JS-Prinzip der asynchronen Ausführung und Rückrufdetails

1. JS-Prinzip der asynchronen Ausführung Wir wiss...

Analyse der Verwendung und des Prinzips der Docker Swarm-Clusterverwaltung

Schwarmclusterverwaltung Einführung Docker Swarm ...

Detaillierte Erklärung zur Verwendung von Scoped Slots in Vue.js-Slots

Inhaltsverzeichnis Keine Slots Vue2.x-Steckplätze...

Vorteile von INSERT INTO SET in MySQL

Daten in MySQL-Datenbank einfügen. Bisher häufig ...

Aktualisierungen für React Router V6

Inhaltsverzeichnis ReactRouterV6-Änderungen 1. &l...

Analyse des neuen Ressourcenmanagementsystems von CocosCreator

Inhaltsverzeichnis 1. Ressourcen und Konstruktion...

Three.js realisiert den dynamischen 3D-Logoeffekt von Facebook Metaverse

Inhaltsverzeichnis Hintergrund Was ist das Metave...

Details der MySQL-Berechnungsfunktion

Inhaltsverzeichnis 2. Feldverkettung 2. Geben Sie...

JS verwendet Map, um doppelte Arrays zu integrieren

Inhaltsverzeichnis Vorwort Daten simulieren Zusam...

So importieren/speichern/laden/löschen Sie Bilder lokal in Docker

1. Docker importiert lokale Images Manchmal kopie...

Verwendung des Vuex-Namespace

Inhaltsverzeichnis Da Vuex einen einzelnen Zustan...