Berechne die verbleibenden Tage bis Weihnachten
Erstelle eine HTML-Seite, auf der die verbleibenden Tage bis Weihnachten berechnet werden. Du benötigst ein Element, in dem das Resultat ausgegeben wird, zB. ein <p> mit einer id. Dein Javascript soll ausgeführt werden, nachdem der Browser die HTML-Inhalte bereits gerendert hat. Daher steht das <script>-Element zu aller letzt im <body>.
Die Berechnung ist nicht kompliziert. Man braucht das Datum heute und das Datum von Weihnachten. Die Daten zieht man voneinander ab und zeigt die Differenz in Tagen an.
Um die Berechnung von Monaten und Tagen zu vereinfachen, benutzt man häufig den UNIX-Timestamp, eine Zeitrepräsentation in Sekunden seit 1. Januar 1970. Mit diesen ganzzahligen Werten lässt sich die Differenz leicht kalkulieren.
Das Datum von heute als UNIX-Timestamp:
let heute = new Date().getTime();Das Datum von Weihnachten:
let xmas = new Date(2019, 11, 24).getTime();Weil es sich um Millisekundenwerte handelt, muss man zunächst durch 1000 teilen (ergibt Sekunden), danach durch 60 (ergibt Minuten), nochmal durch 60 (ergibt Stunden), zuletzt durch 24 (ergibt Tage).
Hat man den Wert berechnet, muss man ihn noch sichtbar auf der Seite platzieren, als Inhalt des dafür vorgesehenen <p>-Elements, das wir zu Beginn platziert haben.
document.querySelector('p#deine-id').innerHTML = ergebnisWert;Bonusaufgabe:
- Man kann evtl. eine Bedingung vorsehen, dass auch Tage nach Weihnachten ein korrektes Ergebnis ausgeben. (siehe Javascript
if) - Man kann die generierten Datumsangaben so umformulieren, dass sie für jedes Jahr funktionieren, nicht nur 2019. Mit
Date().getFullYear()lässt sich das aktuelle Jahr herausfinden. - Im Idealfall passt Du die Gestaltung der Seite noch etwas mit
CSSan, dass ersichtlich ist, was das Ergebnis ist und wofür die Seite überhaupt da ist.
Die veranschlagte Bearbeitungszeit für diese Aufgabe beträgt 7 Tage, bis zur nächsten Kursstunde.
Die Abgabe dieser Aufgabe ist nicht vorgesehen und dient lediglich deiner eigenen Übung.