IdentifiantMot de passe
Loading...
Mot de passe oublié ?Je m'inscris ! (gratuit)
Navigation

Inscrivez-vous gratuitement
pour pouvoir participer, suivre les réponses en temps réel, voter pour les messages, poser vos propres questions et recevoir la newsletter

JavaScript Discussion :

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


Sujet :

JavaScript

  1. #1
    Membre du Club
    Inscrit en
    Mars 2008
    Messages
    80
    Détails du profil
    Informations forums :
    Inscription : Mars 2008
    Messages : 80
    Points : 41
    Points
    41
    Par défaut 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 : Sélectionner tout - Visualiser dans une fenêtre à part
    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.

  2. #2
    Futur Membre du Club
    Inscrit en
    Juillet 2010
    Messages
    4
    Détails du profil
    Informations forums :
    Inscription : Juillet 2010
    Messages : 4
    Points : 5
    Points
    5
    Par défaut mmm
    pourquoi pas??
    essayez avec getElementByTagName(' ')

  3. #3
    Membre du Club
    Inscrit en
    Mars 2008
    Messages
    80
    Détails du profil
    Informations forums :
    Inscription : Mars 2008
    Messages : 80
    Points : 41
    Points
    41
    Par défaut
    Merci volvo14. Si je fais :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    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 ?

  4. #4
    Membre averti
    Profil pro
    Inscrit en
    Avril 2008
    Messages
    397
    Détails du profil
    Informations personnelles :
    Localisation : France

    Informations forums :
    Inscription : Avril 2008
    Messages : 397
    Points : 430
    Points
    430
    Par défaut
    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.

  5. #5
    Membre habitué
    Homme Profil pro
    Inscrit en
    Juillet 2004
    Messages
    91
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France

    Informations forums :
    Inscription : Juillet 2004
    Messages : 91
    Points : 130
    Points
    130
    Par défaut
    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 : Sélectionner tout - Visualiser dans une fenêtre à part
    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.

  6. #6
    Expert confirmé
    Avatar de RomainVALERI
    Homme Profil pro
    POOête
    Inscrit en
    Avril 2008
    Messages
    2 652
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 47
    Localisation : France, Meurthe et Moselle (Lorraine)

    Informations professionnelles :
    Activité : POOête

    Informations forums :
    Inscription : Avril 2008
    Messages : 2 652
    Points : 4 164
    Points
    4 164
    Par défaut
    Citation Envoyé par thibaud74 Voir le message
    Merci volvo14. Si je fais :
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    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 html : Sélectionner tout - Visualiser dans une fenêtre à part
    <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 ^^

    ...pour les linguistes et les curieux >>> générateur de phrases aléatoires

    __________________

  7. #7
    Rédacteur

    Avatar de Bovino
    Homme Profil pro
    Développeur Web
    Inscrit en
    Juin 2008
    Messages
    23 647
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 53
    Localisation : France, Gironde (Aquitaine)

    Informations professionnelles :
    Activité : Développeur Web
    Secteur : High Tech - Éditeur de logiciels

    Informations forums :
    Inscription : Juin 2008
    Messages : 23 647
    Points : 91 220
    Points
    91 220
    Billets dans le blog
    20
    Par défaut
    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    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 ???
    Pas de question technique par MP !
    Tout le monde peut participer à developpez.com, vous avez une idée, contactez-moi !
    Mes formations video2brain : La formation complète sur JavaScriptJavaScript et le DOM par la pratiquePHP 5 et MySQL : les fondamentaux
    Mon livre sur jQuery
    Module Firefox / Chrome d'intégration de JSFiddle et CodePen sur le forum

  8. #8
    Membre du Club
    Inscrit en
    Mars 2008
    Messages
    80
    Détails du profil
    Informations forums :
    Inscription : Mars 2008
    Messages : 80
    Points : 41
    Points
    41
    Par défaut
    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 : Sélectionner tout - Visualiser dans une fenêtre à part
    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.

+ Répondre à la discussion
Cette discussion est résolue.

Discussions similaires

  1. récupérer le contenu d'une page web
    Par marielaure2805 dans le forum Langage
    Réponses: 4
    Dernier message: 28/02/2007, 13h12
  2. Récupérer le contenu d'une page web
    Par smarties dans le forum Entrée/Sortie
    Réponses: 2
    Dernier message: 13/02/2007, 01h25
  3. récupérer des infos d'une page web (TWebBrowser)
    Par LotfiB dans le forum C++Builder
    Réponses: 3
    Dernier message: 16/01/2007, 21h59
  4. [RegEx] Récupérer des données dans une page Web
    Par Pragmateek dans le forum Langage
    Réponses: 8
    Dernier message: 24/05/2006, 19h44
  5. [Servlet]Récupérer le contenu d'une page web
    Par Jarodnet dans le forum Servlets/JSP
    Réponses: 6
    Dernier message: 06/10/2005, 15h47

Partager

Partager
  • Envoyer la discussion sur Viadeo
  • Envoyer la discussion sur Twitter
  • Envoyer la discussion sur Google
  • Envoyer la discussion sur Facebook
  • Envoyer la discussion sur Digg
  • Envoyer la discussion sur Delicious
  • Envoyer la discussion sur MySpace
  • Envoyer la discussion sur Yahoo