Compter des getElementById

Recherche :

Mot : Pseudo : Filtrer
Bas de page
Auteur	Sujet : Compter des getElementById

rdams

Bonjour,

je voulais savoir si il était possible de compter des éléments d'une page web afin de faire une boucle pour pouvoir
afficher ou cacher ces elements à l'aide d'une fonction javascript.

chaque element à un id d'attribué et par exemple je voudrais compter (ou recuperer) tout les éléments commençant par "ligne_"
pour ensuite faire une boucle avec ceci à l'intérieur.

Code :

if(document.getElementById("ligne_***" ).style.display=="none" ){
document.getElementById("ligne_***" ).style.display="block";
}else{
document.getElementById("ligne_***" ).style.display="none";
}

Si c'est possible, quelle fonction utiliser ?

Publicité

olivthill

Oui, je pense qu'il est possible de compter les éléments d'un objet, avec objet.elements.length. Je l'ai déjà fait pour les éléments d'un formulaire (avec le bout de code ci-dessous), et je pense que cela devrait être à peu près la même chose pour les élément d'une page entière.

form_obj = document.getElementById(form_name);
for (i = 0; i < form_obj.elements.length; i++) {
if (form_obj.elements[i].type == "text" ) {
// J'ai un champ de type text, etc...
}
}

rdams

j'ai essayer de faire un getElementById sur la page mais ça ne marche pas, j'ai essayer sans passer de parametre.
J'ai rechercher sur différent site et d'aprés ce que j'ai vue ça ne fonctionne qu'avec des formulaires.

Y a t'il moyen de compter les element par id dans une page html sinon comment faire ??

Bidem

Je ne crois pas qu'il y ait un moyen de récupérer tous les éléments d'une page de façon propre (c'est à dire sans utiliser document.all).

Sans voir ton code Html, c'est dur d'imaginer une solution mais j'imagine que tous tes éléments "ligne_*" ont le même tag (<p>, <div> ou équivalent). si c'est le cas, tu peux utiliser document.getElementsByTag() pour récupérer un tableau contenant tous les éléments d'un type donné, ensuite il ne te reste plus qu'à parcourir les éléments du tableau et extraire ceux dont le nom commence par "ligne_"

ex :

Code :

mesDiv = document.getElementsByTag("div" );
for (i = 0; i < mesDiv.length; i++) {
if (mesDiv[i].id.substring(0, 6) == "ligne_" ) {
// l'id commence par "ligne_"
}
}

gatsu35

Blablaté par Harko

mesDiv = document.getElementsByTagName("div" );

et
(mesDiv[i].id.indexOf("ligne_" )!=-1)

rdams

ok ça fonctionne, mais maintenant ça bug au niveau de l'affichage
voici mon code pour l'instant

Code :

var tab_tr = document.getElementsByTagName('tr');
for(var i=0; i<tab_tr.length; i++){
if(tab_tr[i].id.indexOf("ligne_"+cle)!=-1){
if(document.getElementById("ligne_"+cle).style.display=="none" ){
document.getElementById("ligne_"+cle).style.display="block";
}else{
document.getElementById("ligne_"+cle).style.display="none";
}
}
}

chaque ligne à un id, à chaque fois que je redescend d'un niveau, mon id reprend _key
(le nom des niveau ne correspond pas du tout à ce qui suit, ce sont des groupe de travail et sous groupe, j'ai mis ceci pour simplifier, la seul chose qui reste est le '_'
exemple
ligne_niv1a
ligne_niv1a_niv2a
ligne_niv1a_niv2a_niv3a
ligne_niv1a_niv2a_niv3a_niv4a
ligne_niv1a_niv2a_niv3b
ligne_niv1a_niv2b
ligne_niv1b

mon but est d'afficher les niveaux juste en dessous donc qui comportent un _ en plus que le niveau supérieur.
comment faire pour recuperer juste un niveau inferieur pour le mettre dans mon getElementById à la place du "ligne_"+cle que j'ai mis

Message édité par rdams le 23-02-2006 à 10:28:48

Bidem

Citation :

mesDiv = document.getElementsByTagName("div" );

oups ...

Citation :

(mesDiv[i].id.indexOf("ligne_" )!=-1)

dans la pratique ça doit marcher mais :
- s'il a un id = "totoligne_", ça va le prendre aussi (ses id ont l'air cohérents donc pas de problème)
- c'est + lent car ça parcourt tout l'id (et apparemment ses id peuvent être longs) alors qu'avec substring on ne parcourt que 6 caractères

Citation :

Code :

if(document.getElementById("ligne_"+cle).style.display=="none" ){
document.getElementById("ligne_"+cle).style.display="block";
}else{
document.getElementById("ligne_"+cle).style.display="none";
}

Ce code veut dire que chaque fois que tu tombes sur un élement commançant par 'ligne_niv1a', tu inverses le display de l'élément de plus haut niveau.

ex : quand tu tombes sur ligne_niv1a_niv2a_niv3a_niv4a, tu inverse le display de ligne_niv1a

Message édité par Bidem le 23-02-2006 à 10:46:58

Bidem

Citation :

mon but est d'afficher les niveaux juste en dessous donc qui comportent un _ en plus que le niveau supérieur.
comment faire pour recuperer juste un niveau inferieur pour le mettre dans mon getElementById à la place du "ligne_"+cle que j'ai mis

Si le caractère '_' n'apparait pas dans le nom de tes sous groupes, tu peux utiliser la fonction split() et compter le nombre d'éléments du tableau retourné

Code :

var id_objet = tab_tr[i].id;
var tab = id_objet.split("_" ); // découpe la string
// tab[0] == ligne
// tab[1] == valeur de la clée
if (tab.length == 3) {
// l'id contenait exactement 3 élements ex : ligne_niv1a_niv2a
}

rdams

je viens de faire ceci, le probleme maintenant c'est qu'il ne m'affiche que le 1er element d'un sous niveau meme s'il y en a plusieurs

Code :

var nb_id=0;
var nb_cle=0;
var tab_tr_abo = new Array();;
//on recupere ds un tableau le nbre de ligne (tr) dans la page html
var tab_tr = document.getElementsByTagName('tr');
for(var i=0; i<tab_tr.length; i++){
if(tab_tr[i].id.indexOf("ligne_"+cle)!=-1){
var test = tab_tr[i].id.indexOf("ligne_"+cle);
//recherche du nbre de _ dans tab_tr[i] et dans cle
var tab_id=tab_tr[i].id.match(/_/g);
nb_id=tab_id.length;
var tab_cle=cle.match(/_/g);
if(tab_cle){
nb_cle=tab_cle.length;
}else{
nb_cle=0;
}
// test du nbre de _, pour affcher ou supprimer le niv suivant
if(nb_id==(nb_cle+2)){
if(document.getElementById(tab_tr[i].id).style.display=="none" ){
document.getElementById(tab_tr[i].id).style.display="block";
}else{
document.getElementById(tab_tr[i].id).style.display="none";
}
}
}
}

rdams

c'est peut etre bon, j'ai un petit prob d'init des cle niveau php sur la fond de l'arbre.

Publicité

gatsu35

Blablaté par Harko

ca fait crade ta facon de faire nan ?
moi j'aurai plutot vu un genre de liste <ul><li> imbriqués
avec un joli JS DOM :
http://gatsu.ftp.free.fr/html/Exem [...] cence.html

rdams

Je suis arrivé au resultat pour agrandir pas de prob mais ensuite pour reduire la galere,
j'ai essayé ta solution Gatsu35, elle me plait bien.

Merci pour votre aide, j'en connais un peu plus en JS ce soir.

gatsu35

Blablaté par Harko

ouais mais il est un peu buggué.

C'est fou ça kan mêle, tu fais un truc pour une boite apparament et un gros truc et tu ne ocnnais presque rien en JS.

Bon personne pour me donner du boulot là ?

rdams

oui le JS, je connais pas trop,
as tu un lien avec un cour sur le JS qui explique bien les methodes des différents objet, à quoi elles servent.

merci

FORUM HardWare.fr

Programmation

HTML/CSS

Compter des getElementById

Sujets relatifs
Compter un nombre de jours en timestamp	compter le nombre de fichier dans une table
[Excel] Compter le nombre de cellule non vide d'une colonne	[RESOLU]Compter le nombre de ligne d'un fichier
Compter le nombre de mots doublons	Compter le nombre de handle
[RESOLU][SH] Compter le nombre d'occurences d'un caractère....	Compter des entrées dans une table mysql
Compter le nombre de ligne dans un fichier texte sous Windows	[Excel] Compter un nombre de 0 contigues, la suite de 0 la plus longue
Plus de sujets relatifs à : Compter des getElementById

Page générée en 0.080 secondes