Как реализовать селектор языка через JS, который переопределяет глобальный CSS ⇐ CSS

[Anonymous]

Я хочу создать простой переключатель языка на основе CSS.
Рассмотрим одну статическую HTML-страницу с содержимым, скажем, на трех языках:
< pre class="lang-html Prettyprint-override">

Код: Выделить всё

Hello World
Hallo Welt
Bonjour la Mond
...
This is my english webpage...
Dies ist meine deutsche Webseite...
Je ne parles pas francais

Когда страница загружается, мы хотим определить язык пользователя (

Код: Выделить всё

navigator.language || navigator.userLanguage

) и отображать только элементы :lang(en), скрывающие все разделы на немецком или французском языке.

Код: Выделить всё

*[lang=en] {display:block}
*[lang=de] {display:none}
*[lang=fr] {display:none}

Теперь, если пользователь выберет немецкий язык, мы хотим, чтобы некоторый JavaScript отключил таблицу стилей глобально (а не по элементам), чтобы мы переопределили приведенный выше CSS с помощью:

Код: Выделить всё

*[lang=en] {display:none}
*[lang=de] {display:block}
*[lang=fr] {display:none}

Как можно добиться такого глобального переопределения CSS в JavaScript?
Примечания:

• Я не хочу выбирать элементы HTML и переключать их отображение — я хочу перезаписать глобальный CSS.
• Как выбран язык, не имеет значения — это будет onclick или onchange, которое запускает JS.
• Я не против, чтобы все элементы lang отображались как блоки, хотя было бы интересно, как переключать их свойство отображения между none и без потери, скажем, display:inline.

Подробнее здесь: https://stackoverflow.com/questions/774 ... global-css