Recuperation de liste html avec du javascript

Marsh Posté le 19-09-2009 à 22:21:17

Bonjour, bon j'ai un truc tout bête à faire mais je bute dessus depuis ce matin [:haribo71]

J'ai une page html avec une liste:

Code :

<ul>
<li>be with you !</li>
<li>Yoda a dit:</li>
<li>May the Force</li>
</ul>

Et donc je souhaite recuperer mes 3 <li>...</li> dans une variable pour jouer avec les trier, ce genre de chose.

j'ai donc écrit:

Code :

function recup()
{
var myUL = document.getElementsByTagName("UL" )[0];
alert(myUL.nodeName); //la ça m'affiche UL, parfait
alert(myUL.childNodes.nodeValue); //la j'ai du undefined, pas bon
}
window.addEventListener('load',recup,false); //ça c'est pour attendre que la page soit chargée avant d'exécuter le script

J'utilise les alert pour voir ou j'en suis.

Bon j'ai essayé tout un tas de truc et ça ne marche toujours pas.
Si vous savez ce qui cloche...
Et aussi, pour quand ça marchera, vous auriez une idée de comment mettre chaque <li> dans une variable différente ?
J'ai cherché une fonction qui pourrais me faire ça mais j'ai pas encore trouvé.

Merci pour votre aide.

---------------
Des Bisous et des nounours ! | Internet 2025 | Dungeon-Generator

Reply

Marsh Posté le 19-09-2009 à 22:21:17

Reply

Marsh Posté le 19-09-2009 à 22:56:19

function recup()
{
var myUL = document.getElementsByTagName("UL" )[0];
var li = muUL.getElementsByTagName("LI" )
for(var i in li)
{
alert(li[i].innerHTML);
}
}

Message cité 1 fois
Message édité par stealth35 le 19-09-2009 à 22:56:51

Reply

Marsh Posté le 19-09-2009 à 23:02:23

stealth35 a écrit :

function recup()
{
var myUL = document.getElementsByTagName("UL" )[0];
var li = muUL.getElementsByTagName("LI" )
for(var i in li)
{
alert(li[i].innerHTML);
}
}

Ça marche, bon je vais bosser le reste et essayer de comprendre ce que tu m'as donné, merci.

Est il possible de récupérer pas seulement le contenu des <li>, mais avec la balise <li> dedans ?
J'ai essayé en mettant un <div> qui englobe tout, mais je reçoit les 3 li dans la même variable, j'arrive pas à les séparer.

Message cité 2 fois
Message édité par Tangrim le 19-09-2009 à 23:17:24

---------------
Des Bisous et des nounours ! | Internet 2025 | Dungeon-Generator

Reply

Marsh Posté le 21-09-2009 à 07:47:26

Tangrim a écrit :

Ça marche, bon je vais bosser le reste et essayer de comprendre ce que tu m'as donné

Code :

var myUL = document.getElementsByTagName("UL" )[0]; // on "demande" la 1ere balise <ul> de notre page (de notre DOM plutôt)
var li = muUL.getElementsByTagName("LI" ); // la on demande toute les <li> que contient l'<ul> précédemment chopé. on obtient donc une liste vu qu'il y a plusieurs <li>
for(var i in li) // On fait une boucle, càd un code qui se répète autant de fois que demandé... ici, "autant de fois qu'il y a d'éléments dans la liste"... i fait aussi office de compteur, il démarre à 0
{
alert(li[i].innerHTML); // Alerte dans une boite de dialogue le contenu HTML de l'élément de notre liste à l'emplacement i
}

Tangrim a écrit :

Est il possible de récupérer pas seulement le contenu des <li>, mais avec la balise <li> dedans ?

Essaye :

Code :

function recup()
{
var myUL = document.getElementsByTagName("UL" )[0];
var contenuUL = muUL.innerHTML;
}

innerHTML te retourne le contenu HTML de l'objet visé... soit ce qu'il y a entre <ul> et </ul>... mais c'est pas forcément + exploitable, ça dépend ce que t'en fait après.

Sinon, si ton premier code ne marchait pas, c'est sans doute que le DOM n'est pas aussi "simple", Gecko ajoute des nœuds de type #text entre les balises...
Si c'est ça, ton code devrait marcher sous IE en théorie...

Message édité par abais le 21-09-2009 à 07:57:22

---------------
Le membre ci-contre n'est pas responsable du message ci-dessus.

Reply

Marsh Posté le 21-09-2009 à 13:46:50

Tangrim a écrit :

Est il possible de récupérer pas seulement le contenu des <li>, mais avec la balise <li> dedans ?
J'ai essayé en mettant un <div> qui englobe tout, mais je reçoit les 3 li dans la même variable, j'arrive pas à les séparer.

théoriquement, ya outerHTML, mais visiblement les navigateurs ne l'implémentent pas... c'est un peu dommage. la meilleure manière reste sans doute de les rajouter toi même.

Reply

Marsh Posté le 22-09-2009 à 10:28:24

Ça marche enfin

Pour les <li> je les ai finalement recréé en js, c'est plus simple que de les chopper dans le html.
Merci d'avoir pris du temps pour m'éclairer.

---------------
Des Bisous et des nounours ! | Internet 2025 | Dungeon-Generator

Reply

Recuperation de liste html avec du javascript

Sujets relatifs:

Leave a Replay