JavaScriptsDatum & Uhrzeit

Jahreszeit

Prüft das aktuelle Datum und verrät die kalendarische Jahreszeit: Frühling, Sommer, Herbst oder Winter.

Ein kleines Script mit einer klaren Aufgabe: Es schaut auf das aktuelle Datum und schreibt die gerade laufende Jahreszeit auf eure Seite — Frühling, Sommer, Herbst oder Winter. In der Demo unten seht ihr direkt, was es für den heutigen Tag ausgibt; einzubauen ist es als hübsche Kleinigkeit etwa auf einer Startseite oder in einer Seitenleiste.

Als Umschaltpunkte nutzt das Script den kalendarischen (astronomischen) Jahreszeitenwechsel: Frühlingsanfang um den 20. März (Tagundnachtgleiche), Sommeranfang um den 21. Juni (Sommersonnenwende), Herbstanfang um den 23. September (Tagundnachtgleiche) und Winteranfang um den 21. Dezember (Wintersonnenwende). Die astronomisch exakten Zeitpunkte schwanken von Jahr zu Jahr um etwa einen Tag — das Script arbeitet mit diesen festen Näherungsdaten, was für den Zweck völlig ausreicht.

Nicht zu verwechseln ist das mit den meteorologischen Jahreszeiten, mit denen Wetterdienste rechnen: Die beginnen der Einfachheit halber immer am Monatsersten (der Frühling z. B. am 1. März). Wenn ihr das lieber mögt, lässt sich das Script mit wenigen Handgriffen umstellen — wie, steht in der Erklärung weiter unten.

Passend zum Kreislauf des Jahres findet ihr im Archiv auch ein Script zur Zeitumstellung auf Sommer- und Winterzeit sowie eines, das das Osterdatum eines beliebigen Jahres berechnet.

Datum & Uhrzeit Baujahr 2007 läuft in deinem Browser

So funktioniert das Script

Das Script besteht aus genau zwei Teilen: einer Funktion getJahreszeit(), die aus einem Datum die Jahreszeit bestimmt, und einer Zeile, die das Ergebnis für den heutigen Tag in die Seite schreibt.

const m = datum.getMonth() + 1;
const d = datum.getDate();

Zuerst holt sich die Funktion Monat und Tag aus dem übergebenen Date-Objekt. Das + 1 hinter getMonth() ist eine Eigenheit von JavaScript: Intern werden die Monate von 0 (Januar) bis 11 (Dezember) gezählt, für die menschenlesbare Rechnung wird daraus wieder 1 bis 12. getDate() liefert dagegen ganz normal den Tag im Monat, also 1 bis 31.

if (m < 3 || (m === 3 && d < 20) || (m === 12 && d > 20)) {
  return "Winter";
}

Dann wird von der kältesten Jahreszeit aufwärts geprüft. Winter ist es in drei Fällen, die mit dem Oder-Operator || verknüpft sind: im Januar und Februar (m < 3), im März vor dem 20. — und am Jahresende ab dem 21. Dezember (m === 12 && d > 20), denn der Winter beginnt ja schon im alten Jahr. Trifft einer der Fälle zu, gibt return das Ergebnis zurück und die Funktion ist fertig.

if (m < 6 || (m === 6 && d < 21)) {
  return "Frühling";
}
if (m < 9 || (m === 9 && d < 23)) {
  return "Sommer";
}
return "Herbst";

Die weiteren Prüfungen funktionieren nach demselben Muster, dürfen aber kürzer ausfallen — wer hier ankommt, ist garantiert kein Winterfall mehr. m < 6 heißt deshalb praktisch „April, Mai oder Rest-März“, dazu der Juni bis zum 20.: Frühling. Danach Sommer bis zum 22. September. Was übrig bleibt (23. September bis 20. Dezember), ist Herbst — dafür braucht es gar keine Bedingung mehr, das letzte return fängt alles Restliche auf.

document.getElementById("jz-ausgabe").innerHTML =
  "Wir haben jetzt <strong>" + getJahreszeit(new Date()) + "</strong>";

new Date() ohne Argumente liefert immer den aktuellen Zeitpunkt. Das Ergebnis der Funktion wird in einen Satz eingebaut und per innerHTML in das Ausgabe-Element geschrieben — das Original benutzte hier noch document.write(), was heute als überholt gilt, weil es nur während des Seitenaufbaus funktioniert. Das Script muss dafür im HTML unter dem Ausgabe-Element stehen, damit dieses schon existiert.

Zum Anpassen: Den Ausgabesatz ändert ihr direkt in der letzten Zeile — z. B. in "Es ist " + … + "!". Wer die meteorologischen Jahreszeiten möchte, vereinfacht die Bedingungen auf reine Monatsprüfungen: Winter ist dann m < 3 || m === 12, Frühling m < 6, Sommer m < 9, der Rest Herbst. Und weil getJahreszeit() jedes beliebige Datum entgegennimmt, könnt ihr auch mal getJahreszeit(new Date(2026, 11, 24)) für Heiligabend 2026 ausprobieren.

Script für die eigene Homepage

Kopiert euch den kompletten Code und fügt ihn an der Stelle eurer Seite ein, an der das Script erscheinen soll. Er läuft ohne weitere Dateien und ohne fremde Server.

Mehr aus der Kategorie Datum & Uhrzeit