[Résolu] Variable avec multiple document.getElementbyId() ?

Bonjour,

J'aimerais savoir comment faire pour mettre ça dans une variable ?

document.getElementById('ImgApc').style.display = "none";
document.getElementById('VidApc').style.display = "none";
document.getElementById('TexApc').style.display = "none";
document.getElementById('ImgMap').style.display = "none";
document.getElementById('ImgDat').style.display = "none";
document.getElementById('ImgCol').style.display = "none";
document.getElementById('ImgLnk').style.display = "none";
document.getElementById('ImgSrc').style.display = "none";
document.getElementById('VidFil').style.display = "none";
document.getElementById('ImgCel').style.display = "none";
document.getElementById('ImgMus').style.display = "none";
document.getElementById('ImgAct').style.display = "none";
document.getElementById('InfApp').style.display = "none";

Merci d'avance

Plustôt comment faire pour ne pas réécrire ceci à chaque fois ?

Ha ? et tu veux que je fasse comment avec du css sur du js ?
tu t'es trompé ?

Je peux pas faire une sorte de "boite" réuilisable, une fonction ?

Salut,
Tu peux faire une fonction :

function cacher (element){
 document.getElementById(element).style.display = "none";
}

ça te permet de pas le réécrire plusieurs fois. Quand tu fais appelle à la fonction, tu lui mets en paramètres l'id de l’élément que tu veux passer à display: none.

Imaginons que c'est dés le chargement de la page, pas sur un click ou autre :
Tu mets tous tes élements à cacher dans un tableau :

var element = ['id1', 'id2', 'id3', 'id4' ......], // On mets tous les éléments dans un tableau
element_l = element.lenght; // On récupère la taille du tableau
for(var i=0;i<element.l;i++){
 cacher(element[i]);
 /* On boucle sur le tableau et pour chacun des éléments on fais appelle à la fonction cacher */
}

[/i]
Modifié par renard13 (30 Jan 2013 - 19:17)

function cacher (element){

 //element à cacher
 document.getElementById('ImgApc').style.display = "none";
 document.getElementById('VidApc').style.display = "none";
 document.getElementById('TexApc').style.display = "none";

 //element à laisser afficher
 document.getElementById(element).style.display = "inline-block";

}

Ça pourrais marcher ça ?

Merci Vaxilart et aussi renard13

Le getElementByClassName = getElementById mais pour les class

cl9m9n7 a écrit :
Le getElementByClassName = getElementById mais pour les class

D'où l'intérêt de la classe CSS dont je parlais.

Par contre ça ne fonctionnera pas sous IE7 et 8.

function cacher (element, etat){
 document.getElementById(element).style.display = etat;
}

Pour getElementByClassName('le nom de la class'), il te renvoi une liste de nœuds (NodeList) des éléments trouvés dans l'ordre dans lequel ils apparaissent dans l'arbre.
Modifié par renard13 (30 Jan 2013 - 19:22)