eine Javascript-Funktion für multiple Div-IDs

Question

Ich habe 3 Div-IDs als "Shirts", "Hoodies", "andere" dann habe ich eine JavaScript-Funktion. Wie könnte ich die gleiche Js-Funktion für alle 3 dieser IDs verwenden?

function myAccFunc() { 
    var x = document.getElementById("divID"); 
    if (x.className.indexOf("w3-show") == -1) { 
    x.className += " w3-show"; 
    } else { 
    x.className = x.className.replace(" w3-show", ""); 
    } 
}  

Answer 1

Funktion aufrufen dies:

myAccFunc("shirts"); 
myAccFunc("hoodies"); 
myAccFunc("other"); 

und die Funktion dieser Art und Weise:

function myAccFunc(div){ 
    var x = document.getElementById(div); 
    if (x.className.indexOf("w3-show") == -1){ 
     x.className += " w3-show"; 
    }else{ 
     x.className = x.className.replace(" w3-show", ""); 
    } 
} 

Answer 2

function myAccFunc(id){ 
    var x = document.getElementById(id); 
    if(!x) return; 

    if (x.className.indexOf("w3-show") == -1) 
    x.className += " w3-show"; 
    else 
    x.className = x.className.replace(" w3-show", ""); 
} 


['id1', 'id2', 'id3'].forEach(myAccFunc); 

Sie könnten sich mit der classList (ES2015) interessiert sein. Es ist ziemlich gut unterstützt, außer dem alten IE.

Answer 3

Versuchen Sie, den divs, die Sie bearbeiten möchten, eine weitere Klasse hinzuzufügen und rufen Sie stattdessen danach. Auch, warum verwenden indexOf zur Überprüfung Existenz, wenn Sie includes

var x = document.getElementsByClass('checkClass'); 
for (i=0;i<x.length - 1;i++){ 
    if (!x[i].className.includes("w3-show")){ 
     x[i]className += " w3-show"; 
    } else { 
    x[i].className = x.className.replace(" w3- show", ""); 
    } 
} 

Answer 4

verwenden kann ich nehme an, Sie nicht alle von ihnen zeigen wollen standardmäßig

Sie konnten die div_id als param geben Verwenden Sie dann Ereignis-Listener, um Funktionen für jedes div aufzurufen.

func myAccFunc(div_id){ 
    var x = document.getElementById(div_id); 
    // rest of your code here 
} 

// event listeners 
document.getElementById("show_shirts_btn").addEventListener("click", function(){ 
     myAccFunc(shirts) 
    }); 

document.getElementById("show_hoodies_btn").addEventListener("click", function(){ 
     myAccFunc(hoodies) 
    }); 


document.getElementById("show_other_btn").addEventListener("click", function(){ 
     myAccFunc(other) 
    });