currentYear im Footer
Automatische Aktualisierung des aktuellen Jahres mit JavaScript.
currentYear im Footer
Das aktuelle Jahr im Footer ist nicht direkt Teil der automatischen Generierung, das HTML
hierzu ist aber im Script generate-navigation.js hinterlegt und
erscheint bei der Ausführung.
Das JavaScript für das aktuelle Jahr selbst ist Teil der main.js
HTML-Struktur im Footer
Im FOOTER_TEMPLATE in generate-navigation.js ist das Jahr bereits mit Fallback-Wert
eingebaut:
<footer class="site-footer">
<div class="container">
<div class="footer-content">
<p class="footer-text">© <span id="currentYear">2025</span> DevPanicZone. Alle Rechte vorbehalten.</p>
<nav class="footer-nav" aria-label="Footer-Navigation">
<a href="/impressum.html">Impressum</a>
<a href="/datenschutzerklaerung.html">Datenschutz</a>
</nav>
</div>
</div>
</footer>
Der Fallback-Wert 2025 wird angezeigt, falls JavaScript
deaktiviert ist. Das JavaScript überschreibt ihn mit dem aktuellen Jahr.
JavaScript-Code
In main.js ist die Funktion setCurrentYear() definiert:
// ===================================
// CURRENT YEAR IM FOOTER
// ===================================
function setCurrentYear() {
const yearSpan = document.getElementById('currentYear');
if (yearSpan) {
yearSpan.textContent = new Date().getFullYear();
}
}
setCurrentYear();
Die Funktion wird innerhalb des DOMContentLoaded Events
aufgerufen, sodass das Element garantiert existiert.
Alternative: Inline Script im Footer
Falls du es nicht in einer separaten JavaScript-Datei haben möchtest, kannst du es auch direkt im Footer einfügen:
<footer class="site-footer">
<div class="container">
<div class="footer-content">
<p class="footer-text">© <span id="currentYear">2025</span> DevPanicZone. Alle Rechte vorbehalten.</p>
<nav class="footer-nav" aria-label="Footer-Navigation">
<a href="/impressum.html">Impressum</a>
<a href="/datenschutzerklaerung.html">Datenschutz</a>
</nav>
</div>
</div>
</footer>
<script>
document.getElementById('currentYear').textContent = new Date().getFullYear();
</script>
Ich würde aber möglichst auf Inline Scripts verzichten. Schau dir dazu auch das Tutorial JavaScript Sicherheit an:
Vorteile der automatischen Jahr-Aktualisierung:
- Kein manuelles Update am 1. Januar nötig
- Copyright ist immer aktuell
- Funktioniert auf allen Seiten automatisch
- Eine Zeile Code, unendlicher Nutzen
Erweiterung: Zeitraum anzeigen (z.B. 2023-2025)
Wenn deine Website seit 2023 besteht, kannst du einen Zeitraum anzeigen:
<p class="footer-text">© 2023-<span id="currentYear"></span> DevPanicZone. Alle Rechte vorbehalten.</p>
Oder noch schlauer: Zeige nur das Startjahr, wenn es das aktuelle Jahr ist:
// ============================================================================
// CURRENT YEAR im Footer - Erweiterte Version
// ============================================================================
const yearElement = document.getElementById('currentYear');
if (yearElement) {
const startYear = 2023; // Gründungsjahr der Website
const currentYear = new Date().getFullYear();
// Wenn aktuelles Jahr = Startjahr: "2023"
// Wenn aktuelles Jahr > Startjahr: "2023-2025"
if (currentYear === startYear) {
yearElement.textContent = startYear;
} else {
yearElement.textContent = `${startYear}-${currentYear}`;
}
}
Ergebnis:
- 2023:
© 2023 DevPanicZone - 2024:
© 2023-2024 DevPanicZone - 2025:
© 2023-2025 DevPanicZone
Mehr aus DevPanicZone!
Tutorials werden geladen...