DOM : récupérer un élément d'une page web

Bonjour !

J'utilise l'inspecteur de document de firefox (add-on) pour trouver les noeuds qui m'intéressent, mais je ne comprend pas bien comment récupérer ces valeurs avec javascript. L'élément que je souhaite récupérer n'a pas d'id. J'aimerai récupérer les éléments qui apparaissent ainsi dans la partie "Document - DOM nodes" de l'inspecteur :

• nodeName = A
• class = wikilink1

Puis dans la partie "Objet - DOM nodes" :

• nodeName = title
• nodeValue = tag:web

Ce qui m'intéresse, c'est ce "tag:web", donc le contenu de nodeValue de l'élément a appartenant à la classe wikilink1.

J'essaie par exemple ce code mais cela ne marche pas :

Code:

---

1 2 3 4 5 6 7

var tags = var tags = document.getElementsByClassName('wikilink1').class.nodeValue; var txt = ""; for (var i in tags) { txt = txt + "\n" + i + " " + typeof(i); } alert(txt);

---

Bien sûr .class. est indéfini est à remplacer, mais par quoi ?

Merci de l'aide,
Thibaud.

pourquoi pas??
essayez avec getElementByTagName(' ')
:ccool::ccool:

Merci volvo14. Si je fais :

Code:

---

1 2	var tags = document.getElementsByTagName('wikilink1'); alert(tags.length);

---

j'obtiens 0. Ce qui signifie qu'il ne trouve pas le noeud par le nom du tag probablement ?

Il serait plus facile de te répondre avec un bout de code HTML, ou on verrait tes éléments, et ce que tu veux récupérer. C'est toujours plus facile de faire du DOM en ayant la structure devant son nez.

Hello thibaud74,

D'après ce que j'ai compris tu as un tag A de classe wikilink1 dont tu voudrais récupérer la valeur de l'attribut title ?

Si c'est bien ça voici le code qui te le permettra :

Code:

---

1 2 3 4 5

var regex = new RegExp("(^|\\s)wikilink1(\\s|$)"); var tags = document.getElementsByTagName('a'); for (var i = 0; i < tags.length; i++) if (regex.test(tags[i].className)) alert(tags[i].getAttribute("title"));;

---

Si comme j'en ai l'impression, tu travailles dans un wiki, regarde s'il n'utilise pas un framework javascript comme jQuery, Prorotype ou autre, car ces frameworks proposent beaucoup de fonctions utilitaires pour ce genre de travail.

Citation:

---

Envoyé par thibaud74

Merci volvo14. Si je fais :

Code:

---

1 2	var tags = document.getElementsByTagName('wikilink1'); alert(tags.length);

---

j'obtiens 0. Ce qui signifie qu'il ne trouve pas le noeud par le nom du tag probablement ?

---

Ca ne risque pas de marcher ;)

document.getElementsByTagName('wikilink1') recherche les éléments dont le nom de balise est wikilink1... ce n'est pas la même chose que la propriété name ^^
Cette balise ne sera donc pas trouvée :

Code:

---

<a href="blabla.htm" name="wikilink1" class="wikilink1" id="wikilink1"></a>

---

...car son nom de balise (le TagName) c'est "A"

La méthode getElementsByClassName ferait l'affaire a priori, mais n'est malheureusement pas implémentée dans IE... :?

La solution communément employée consiste à faire un getElementsByTagName("*") pour récupérer tous les éléments de la page, boucler dessus et tester la classe recherchée... c'est plus long mais ça marche ^^

Code:

---

var tags = document.getElementsByClassName('wikilink1').class.nodeValue;

---

il y a plusieurs erreurs ici ;)

• getElementsByClassName('wikilink1')

cette méthode n'est pas implémentée par IE.

• getElementsByClassName('wikilink1')

comme l'indique le s de Elements, cette méthode renvoie une collection, il faut cibler quel élément de cette collection tu veux utiliser

• .class

class est un mot réservé de JavaScript, si tu cherches le nom de classe, il faut passer par className

• .nodeValue

c'est quoi le nodeValue d'une chaîne de caractère ???

Merci de vos messages. Je m'étais un peu embouillé l'esprit en utilisant l'inspecteur DOM, en retournant au code c'est plus clair. Pour info, voici le bout de code en question :

Code:

---

1 2 3 4 5 6

<div class="tags"><span> <a href="/dokuwiki/doku.php?id=tag:cnrs&amp;do=showtag&amp;tag=tag%3Acnrs" class="wikilink1" title="tag:cnrs" rel="tag">cnrs</a>, <a href="/dokuwiki/doku.php?id=tag:societe&amp;do=showtag&amp;tag=tag%3Asociete" class="wikilink1" title="tag:societe" rel="tag">société</a>, <a href="/dokuwiki/doku.php?id=tag:trace&amp;do=showtag&amp;tag=tag%3Atrace" class="wikilink1" title="tag:trace" rel="tag">trace</a>   </span></div>

---

@Bovino : effectivement, le nodeValue s'applique à un noeud, pas à une chaîne de caractère.
@RomainVALERI : compris, merci ! L'exemple est d'ailleurs donné par sedryk.
@sedryk : merci pour la solution, ça marche ! Pour savoir si dokuwiki utilise jquery ou autre, je ne sais pas, car ce CMS est écrit en php. En revanche, il y a un plugin jquery, donc je suppose que c'est possible de l'utiliser.
@tusssss : effectivement, le code ci-dessus est plus clair.
:ccool: