Regel in CSS Klasse ändern

[Auge]

Hallo

ich versuche einen einfachen Language Switch ohne php zu schreiben.

Wie wird die zu verwendende Sprache festgelegt? Wie kann sie bei einer Fehlauswahl geändert werden?

Ich habe zweisprachigen Inhalt auf parallele divs mit unterschiedlichen Klassen verteilt.

Nun habe ich folgende Styles definiert:

.en {display:inline;}
.de {display: none;}

per js würde ich nun gerne die Regeln bei Bedarf ändern.

Ändere nicht die Regel, ändere eine Angabe im Dokument, so dass andere CSS-Regeln angewendet werden.

  /**
   * Suche das Attribut "lang" im ersten (und dokumentweit einzigen) HTML-Element "html".
   * Erzeuge bei Bedarf das Attribut "lang" und setze oder
   * ändere dessen Wert auf die aktuell zu verwendende Sprache.
   */
document.getElementsByTagName("html")[0].setAttribute("lang", "de");

Es wird also nur an einer Stelle eine Änderung vorgenommen. Mit einem Set von CSS-Regeln, das je nach HTML-Struktur mehr oder minder groß wird, werden Elemente abhängig von der angegebenen Sprache ein- oder ausgeblendet.

html[lang=de] .de { display: block; }
html[lang=de] .en { display: none; }

html[lang=en] .de { display: none; }
html[lang=en] .en { display: block; }

Tschö, Auge