Zeitumstellung

So funktioniert das Script

Das Script besteht aus drei Teilen: Eine Funktion berechnet den letzten Sonntag eines Monats, eine zweite baut daraus den Anzeigetext und schreibt ihn in die Seite, und ganz unten werden beide für die vier Termine (März und Oktober, aktuelles und nächstes Jahr) aufgerufen. Alles steckt in einer sofort ausgeführten Funktion, damit keine Variablennamen mit anderen Scripts auf der Seite kollidieren.

function letzterSonntag(jahr, monat) {
  const datum = new Date(jahr, monat + 1, 0); // Tag 0 = letzter Tag des Monats
  datum.setDate(datum.getDate() - datum.getDay());
  return datum.getDate();
}

Hier steckt die ganze Kalenderlogik in drei Zeilen. Der Trick in der ersten Zeile: JavaScript zählt Monate von 0 (Januar) bis 11 (Dezember), und der Tag 0 eines Monats ist der letzte Tag des Vormonats. new Date(jahr, monat + 1, 0) liefert also den letzten Tag des gewünschten Monats — für den März zum Beispiel den 31.3., egal welches Jahr.

Dann kommt getDay() ins Spiel: Es liefert den Wochentag als Zahl, wobei Sonntag die 0 ist, Montag die 1 und so weiter. Zieht man diese Zahl vom Monatsletzten ab, landet man genau auf dem letzten Sonntag des Monats — ist der Monatsletzte selbst ein Sonntag, wird 0 abgezogen und er bleibt stehen. getDate() gibt zum Schluss die Tagesnummer zurück, etwa 29. Das alte Script von 2007 hat dasselbe noch umständlich über durchgezählte Tage im Jahr und eine eigene Schaltjahrprüfung gerechnet — mit der Datumsarithmetik von Date geht es deutlich kürzer, und Schaltjahre sind automatisch berücksichtigt.

function eintragen(id, jahr, monat, monatsName, richtung) {
  document.getElementById(id).textContent =
    "Am Sonntag, den " + letzterSonntag(jahr, monat) + "." + monatsName + "." + jahr +
    " wird die Uhr eine Stunde " + richtung + "gestellt.";
}

Diese Funktion setzt den Anzeigetext zusammen und schreibt ihn per textContent in das Element mit der übergebenen id — damit ersetzt sie den Platzhaltertext, der im HTML steht, solange das Script noch nicht gelaufen ist. Weil sich nur die Richtung („VOR" oder „ZURÜCK") und die Daten unterscheiden, reicht eine Funktion für alle vier Zeilen.

const jahr = new Date().getFullYear();
eintragen("zu-this-s", jahr, 2, "03", "VOR");
eintragen("zu-this-w", jahr, 9, "10", "ZURÜCK");

new Date() ohne Argumente liefert das aktuelle Datum, getFullYear() das vierstellige Jahr. Danach werden die vier Termine eingetragen: Monat 2 ist wegen der Zählung ab 0 der März, Monat 9 der Oktober. Für das nächste Jahr wird einfach jahr + 1 übergeben.

Zum Anpassen: Die Beschriftungen („Beginn Sommerzeit", „Aktuelles Jahr") stehen ganz normal im HTML, die Satzbausteine der Ausgabe in der Funktion eintragen() — beides könnt ihr frei umformulieren. Wer nur die Termine des aktuellen Jahres zeigen will, löscht die beiden zu-next-…-Absätze und die zugehörigen Aufrufe.