Kann man diesen JS-Code kürzer realisieren?

[Universaldenker]

[CODE]var phF = document.getElementById(„phF“);
var phFU1 = document.getElementById(„phFU1“);
var phFU2 = document.getElementById(„phFU2“);
var phFU3 = document.getElementById(„phFU3“);
var phFU4 = document.getElementById(„phFU4“);
var phFU5 = document.getElementById(„phFU5“);
var phFU6 = document.getElementById(„phFU6“);
var phFU6 = document.getElementById(„phFU7“);
var phFU6 = document.getElementById(„phFU8“);
var phFU6 = document.getElementById(„phFU9“);
var phFU6 = document.getElementById(„phFU10“);

var phFUB0 = document.getElementById(„phFUB0“);
var phFUB1 = document.getElementById(„phFUB1“);
var phFUB2 = document.getElementById(„phFUB2“);
var phFUB3 = document.getElementById(„phFUB3“);
var phFUB4 = document.getElementById(„phFUB4“);
var phFUB5 = document.getElementById(„phFUB5“);
var phFUB6 = document.getElementById(„phFUB6“);
var phFUB6 = document.getElementById(„phFUB7“);
var phFUB6 = document.getElementById(„phFUB8“);
var phFUB6 = document.getElementById(„phFUB9“);
var phFUB6 = document.getElementById(„phFUB10“);

function umstellen0() {
phF.style.display = „block“;
phFU1.style.display = „none“;
phFU2.style.display = „none“;
phFU3.style.display = „none“;
phFU4.style.display = „none“;
phFU5.style.display = „none“;
phFU6.style.display = „none“;
phFU7.style.display = „none“;
phFU8.style.display = „none“;
phFU9.style.display = „none“;
phFU10.style.display = „none“;
}

function umstellen1() {
phF.style.display = „none“;
phFU1.style.display = „block“;
phFU2.style.display = „none“;
phFU3.style.display = „none“;
phFU4.style.display = „none“;
phFU5.style.display = „none“;
phFU6.style.display = „none“;
phFU7.style.display = „none“;
phFU8.style.display = „none“;
phFU9.style.display = „none“;
phFU10.style.display = „none“;
}

function umstellen2() {
phF.style.display = „none“;
phFU1.style.display = „none“;
phFU2.style.display = „block“;
phFU3.style.display = „none“;
phFU4.style.display = „none“;
phFU5.style.display = „none“;
phFU6.style.display = „none“;
phFU7.style.display = „none“;
phFU8.style.display = „none“;
phFU9.style.display = „none“;
phFU10.style.display = „none“;

}

function umstellen3() {
phF.style.display = „none“;
phFU1.style.display = „none“;
phFU2.style.display = „none“;
phFU3.style.display = „block“;
phFU4.style.display = „none“;
phFU5.style.display = „none“;
phFU6.style.display = „none“;
phFU7.style.display = „none“;
phFU8.style.display = „none“;
phFU9.style.display = „none“;
phFU10.style.display = „none“;
}

function umstellen4() {
phF.style.display = „none“;
phFU1.style.display = „none“;
phFU2.style.display = „none“;
phFU3.style.display = „none“;
phFU4.style.display = „block“;
phFU5.style.display = „none“;
phFU6.style.display = „none“;
phFU7.style.display = „none“;
phFU8.style.display = „none“;
phFU9.style.display = „none“;
phFU10.style.display = „none“;
}

function umstellen5() {
phF.style.display = „none“;
phFU1.style.display = „none“;
phFU2.style.display = „none“;
phFU3.style.display = „none“;
phFU4.style.display = „none“;
phFU5.style.display = „block“;
phFU6.style.display = „none“;
phFU7.style.display = „none“;
phFU8.style.display = „none“;
phFU9.style.display = „none“;
phFU10.style.display = „none“;
}

function umstellen6() {
phF.style.display = „none“;
phFU1.style.display = „none“;
phFU2.style.display = „none“;
phFU3.style.display = „none“;
phFU4.style.display = „none“;
phFU5.style.display = „none“;
phFU6.style.display = „block“;
phFU7.style.display = „none“;
phFU8.style.display = „none“;
phFU9.style.display = „none“;
phFU10.style.display = „none“;
}

function umstellen7() {
phF.style.display = „none“;
phFU1.style.display = „none“;
phFU2.style.display = „none“;
phFU3.style.display = „none“;
phFU4.style.display = „none“;
phFU5.style.display = „none“;
phFU6.style.display = „none“;
phFU7.style.display = „block“;
phFU8.style.display = „none“;
phFU9.style.display = „none“;
phFU10.style.display = „none“;
}

function umstellen8() {
phF.style.display = „none“;
phFU1.style.display = „none“;
phFU2.style.display = „none“;
phFU3.style.display = „none“;
phFU4.style.display = „none“;
phFU5.style.display = „none“;
phFU6.style.display = „none“;
phFU7.style.display = „none“;
phFU8.style.display = „block“;
phFU9.style.display = „none“;
phFU10.style.display = „none“;
}

function umstellen9() {
phF.style.display = „none“;
phFU1.style.display = „none“;
phFU2.style.display = „none“;
phFU3.style.display = „none“;
phFU4.style.display = „none“;
phFU5.style.display = „none“;
phFU6.style.display = „none“;
phFU7.style.display = „none“;
phFU8.style.display = „none“;
phFU9.style.display = „block“;
phFU10.style.display = „none“;
}

function umstellen10() {
phF.style.display = „none“;
phFU1.style.display = „none“;
phFU2.style.display = „none“;
phFU3.style.display = „none“;
phFU4.style.display = „none“;
phFU5.style.display = „none“;
phFU6.style.display = „none“;
phFU7.style.display = „none“;
phFU8.style.display = „none“;
phFU9.style.display = „none“;
phFU10.style.display = „block“;
}

if (phFUB0 !== null) {phFUB0.onclick = umstellen0;}
if (phFUB1 !== null) {phFUB1.onclick = umstellen1;}
if (phFUB2 !== null) {phFUB2.onclick = umstellen2;}
if (phFUB3 !== null) {phFUB3.onclick = umstellen3;}
if (phFUB4 !== null) {phFUB4.onclick = umstellen4;}
if (phFUB5!== null) {phFUB5.onclick = umstellen5;}
if (phFUB6!== null) {phFUB6.onclick = umstellen6;}
if (phFUB7!== null) {phFUB7.onclick = umstellen6;}
if (phFUB8!== null) {phFUB8.onclick = umstellen6;}
if (phFUB9!== null) {phFUB9.onclick = umstellen6;}
if (phFUB10!== null) {phFUB10.onclick = umstellen6;}[/CODE]

[Tronjer]

Jo, kann man. So um gefühlte 90%.

Das Zauberwort heißt Loop.
https://developer.mozilla.org/en-US/docs/Web/JavaScript/Guide/Loops_and_iteration

[Universaldenker]

@Sempervivum

Ich würde es so machen:

var phFU = [document.getElementById("phF")]; for (var i = 1; i <= 10; i++) { phFU.push(document.getElementById("phFU" + i)); } var phFUB = []; for (var i = 0; i <= 10; i++) { phFUB.push(document.getElementById("phFUB" + i)); } function umstellen(idx) { phFU.forEach(function (item, i) { if (idx == i) item.style.display = "block"; else item.style.display = "none"; }) } phFUB.forEach(function (item, idx) { if (item == null) item.onclick = umstellen(idx); });

Woah, der Code ist richtig kurz! Aber irgendwie funktioniert er nicht. Es wird komischerweise nichts eingeblendet, wenn ich unterschiedliche umstellen-Funktionen benutze
Hier ist mein html code:

[HTML]

…umgestellt nach der Viskosität

[ \eta ~=~ \frac{ F_{\text R} }{ 6\pi , r , v } ]

...umgestellt nach dem Radius

\[ r ~=~ \frac{ F_{\text R} }{ 6\pi \, \eta \, v } \]

...umgestellt nach der Geschwindigkeit

\[ v ~=~ \frac{ F_{\text R} }{ 6\pi \, \eta \, r } \]

andere Form...

• umgestellt nach der Viskosität \( \eta \)
• umgestellt nach dem Radius \( r \)
• umgestellt nach der Geschwindigkeit \( v \)
• umgestellt nach der Reibungskraft \( F_{\text R} \)

[/HTML]

[Universaldenker]

@Sempervivum

Stimmt, da waren noch Fehler:
[/CODE]Allerdings wird so auch das ganze Menü versteckt, weil umstellen() auch auf #phFU wirkt. Willst Du das wirklich?

#phFU sollte immer eingeblendet sein, weil das ein

-Menü ist, wo man verschiedene umstellen-Funktionen aufruft uuuund #phF sollte standardmäßig eingeblendet sein, wenn die Seite geladen ist. Ansonsten wird #phF durch #phFU1, #phFU2 usw. ersetzt, je nach dem welche Funktion im Menü aufgerufen wird.

Hier ist ein Beispiel:
https://universaldenker.de/physik/formeln/484

Es wird eine andere Formel eingeblendet, wenn untere dem Menü „andere Formen…“ irgendeine umstellen-Funktion aufgerufen wird. =))

[Universaldenker]

@Sempervivum

Ist dies jetzt, was Du brauchst?

Perfekt! Es funkioniert, wie gewünscht! VIELEN DANK! :)))

[Universaldenker]

Ich hab da noch nen Code gebastelt und frage mich, ob es einfacher geht … =D

[CODE] iNav.addEventListener(„change“, function(){

        if(iNav.value == "videos"){
            iGo.href = '/videos' + (iNav1.value !== "none" ? "/" + iNav1.value : "");
            iNav1.style.display = "block";
            iNav2.style.display = "none";
            iNav3.style.display = "none";
        }else if (iNav.value == "themen") {
            iGo.href = '/themen' + (iNav1.value !== "none" ? "/" + iNav1.value : "");
            iNav1.style.display = "block";
            iNav2.style.display = "none";
            iNav3.style.display = "none";
        }else if (iNav.value == "aufgaben") {
            iGo.href = '/aufgaben' + (iNav1.value !== "none" ? "/" + iNav1.value : "");
            iNav1.style.display = "block";
            iNav2.style.display = "none";
            iNav3.style.display = "none";
        }else if (iNav.value == "fragen") {
            iGo.href = '/fragen' + (iNav1.value !== "none" ? "/" + iNav1.value : "");
            iNav1.style.display = "block";
            iNav2.style.display = "none";
            iNav3.style.display = "none";
        }else if (iNav.value == "formeln") {
            iGo.href = '/formeln' + (iNav1.value !== "none" ? "/" + iNav1.value : "");
            iNav1.style.display = "block";
            iNav2.style.display = "none";
            iNav3.style.display = "none";
        }else if (iNav.value == "bilder") {
            iGo.href = '/bilder' + (iNav1.value !== "none" ? "/" + iNav1.value : "");
            iNav1.style.display = "block";
            iNav2.style.display = "none";
            iNav3.style.display = "none";
            
        }else if (iNav.value == "icons") {
            iGo.href = '/icons' + (iNav3.value !== "none" ? "/" + iNav3.value : "");
            iNav2.style.display = "none";
            iNav1.style.display = "none";
            iNav3.style.display = "block";
            
        }else if (iNav.value == "sounds") {
            iGo.href = '/sounds' + (iNav2.value !== "none" ? "/" + iNav2.value : "");
            iNav2.style.display = "block";   
            iNav3.style.display = "none";
            iNav1.style.display = "none";
            
        }else if (iNav.value == "links") {
            iGo.href = '/links';
            iNav3.style.display = "none";
            iNav2.style.display = "none";
            iNav1.style.display = "none";
        }else if (iNav.value == "bezeichnungen") {
            iGo.href = '/bezeichnungen';
            iNav3.style.display = "none";
            iNav2.style.display = "none";
            iNav1.style.display = "none";
        }else if (iNav.value == "kontakt") {
            iGo.href = '/kontakt';
            iNav3.style.display = "none";
            iNav2.style.display = "none";
            iNav1.style.display = "none";
        }   
    });[/CODE]