58 lines
2.3 KiB
JavaScript
58 lines
2.3 KiB
JavaScript
/**
|
|
* Dieser Code lädt beim Start der Seite (DOMContentLoaded) Header und Footer dynamisch vom Server
|
|
* (über /header und /footer) und fügt sie in die vorgesehenen Elemente ein.
|
|
* Tritt ein Fehler auf (z.B. Datei nicht vorhanden oder Serverproblem),
|
|
* wird eine Fehlermeldung direkt auf der Webseite angezeigt.
|
|
*/
|
|
|
|
// Warten bis das gesamte DOM geladen ist
|
|
document.addEventListener("DOMContentLoaded", () => {
|
|
// Header laden
|
|
const headerTarget = document.getElementById("header");
|
|
if (headerTarget) {
|
|
// Header-Inhalt vom Server anfordern
|
|
fetch("/header")
|
|
.then(response => {
|
|
// Prüfen, ob die Antwort erfolgreich war
|
|
if (!response.ok) throw new Error("Header nicht gefunden");
|
|
return response.text();
|
|
})
|
|
.then(data => {
|
|
// Header-Inhalt in die Seite einfügen
|
|
headerTarget.innerHTML = data;
|
|
})
|
|
.catch(error => {
|
|
// Fehlerbehandlung: Fehlermeldung im Header-Bereich anzeigen
|
|
headerTarget.innerHTML = `
|
|
<div style="background: #ffdede; color: #a00; padding: 10px; text-align: center;">
|
|
Fehler beim Laden des Headers.
|
|
</div>`;
|
|
console.error(error);
|
|
});
|
|
}
|
|
|
|
// Footer laden
|
|
const footerTarget = document.getElementById("footer");
|
|
if (footerTarget) {
|
|
// Footer-Inhalt vom Server anfordern
|
|
fetch("/footer")
|
|
.then(response => {
|
|
// Prüfen, ob die Antwort erfolgreich war
|
|
if (!response.ok) throw new Error("Footer nicht gefunden");
|
|
return response.text();
|
|
})
|
|
.then(data => {
|
|
// Footer-Inhalt in die Seite einfügen
|
|
footerTarget.innerHTML = data;
|
|
})
|
|
.catch(error => {
|
|
// Fehlerbehandlung: Die Fehlermeldung im Footer-Bereich anzeigen
|
|
footerTarget.innerHTML = `
|
|
<div style="background: #ffdede; color: #a00; padding: 10px; text-align: center;">
|
|
Fehler beim Laden der Fußzeile.
|
|
</div>`;
|
|
console.error(error);
|
|
});
|
|
}
|
|
});
|