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 :

Afficher arbre DOM Complet avec "branches"


Sujet :

JavaScript

Vue hybride

Message précédent Message précédent   Message suivant Message suivant
  1. #1
    Membre habitué
    Homme Profil pro
    Lycéen
    Inscrit en
    Mai 2011
    Messages
    9
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Vendée (Pays de la Loire)

    Informations professionnelles :
    Activité : Lycéen

    Informations forums :
    Inscription : Mai 2011
    Messages : 9
    Par défaut Afficher arbre DOM Complet avec "branches"
    Bonjour,
    Je souhaiterait afficher l'arbre complet du DOM ,en javascript, d'une Iframe (html ou xml). (pas de probleme pour acceder a l'iframe et pour obtenir tous les éléments)

    Après de nombreux essais j'ai réussit a afficher tous les noeuds du document, le problème c'est qu'ils ne sont ni dans l'ordre ni liées les uns aux autres.

    Enfaîte je souhaiterait obtenir un résultat semblable à un print_r(); en php :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    Array([KEY] => value,[KEY2] => Array([KEY] => value) ... )
    J'ai donc essayé de parcourir le dom en utilisant la recursivité :


    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
     
    			var testchain = '';
    			var iii = 0;
     
    			function ParseDOM(node){
     
    				if(isset(node)){
    					if(node == '[object NodeList]'){
    						for(var i = 0, l = node.length;i <= l;i++){
    							ParseDOM(node[i]);
    						}			
    					}else{
    						if(node.hasChildNodes()){
    							ParseDOM(node.childNodes);
    						}else{
    						      testchain +=node;   ii++;
    						}
    					}
    				}
     
    			}
     
    ParseDOM(getDocument(document.getElementsByName(XHE.Node.Iframe.Id)[0]));
    Et comme je l'ai dit ils ne sont pas dans l'ordre et on ne peut reconnaitre leur parents. En plus de cela certain manque a l'appel ... vous pouvez essayer vous meme.


    Je cherche a faire ça pour l'afficher en tant que liste avec affichage des liens de parenté. (donc en insérant des balises html dans la fonction de parcoure du DOM)



    Voila si vous avez des idées je suis preneur ,
    merci.

  2. #2
    Rédacteur/Modérateur

    Avatar de SpaceFrog
    Homme Profil pro
    Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Inscrit en
    Mars 2002
    Messages
    39 659
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 75
    Localisation : Royaume-Uni

    Informations professionnelles :
    Activité : Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Secteur : Industrie

    Informations forums :
    Inscription : Mars 2002
    Messages : 39 659
    Billets dans le blog
    1
    Ma page Developpez - Mon Blog Developpez
    Président du CCMPTP (Comité Contre le Mot "Problème" dans les Titres de Posts)
    Deux règles du succès: 1) Ne communiquez jamais à quelqu'un tout votre savoir...
    Votre post est résolu ? Alors n'oubliez pas le Tag

    Venez sur le Chat de Développez !

  3. #3
    Membre habitué
    Homme Profil pro
    Lycéen
    Inscrit en
    Mai 2011
    Messages
    9
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Vendée (Pays de la Loire)

    Informations professionnelles :
    Activité : Lycéen

    Informations forums :
    Inscription : Mai 2011
    Messages : 9
    Par défaut
    Merci

    Je vais voir si j'arrive a modifier cette fonction, car je veut aussi récupérer la classe commençant par '¤' de l’élément (tous en ont une je la créée (genre : ¤1 ¤2)).
    Pour pouvoir accéder a l'élément lorsque je clique sur sa représentation ...
    je sait c'est tordu mais c'est pour réaliser un éditeur visuel html mais pas inline.

    Je met en résolue si j'y arrive

  4. #4
    Rédacteur/Modérateur

    Avatar de SpaceFrog
    Homme Profil pro
    Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Inscrit en
    Mars 2002
    Messages
    39 659
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Âge : 75
    Localisation : Royaume-Uni

    Informations professionnelles :
    Activité : Développeur Web Php Mysql Html Javascript CSS Apache - Intégrateur - Bidouilleur SharePoint
    Secteur : Industrie

    Informations forums :
    Inscription : Mars 2002
    Messages : 39 659
    Billets dans le blog
    1
    Par défaut
    jquery ...

    jette un oeil sur les selecteurs de jquery
    Ma page Developpez - Mon Blog Developpez
    Président du CCMPTP (Comité Contre le Mot "Problème" dans les Titres de Posts)
    Deux règles du succès: 1) Ne communiquez jamais à quelqu'un tout votre savoir...
    Votre post est résolu ? Alors n'oubliez pas le Tag

    Venez sur le Chat de Développez !

  5. #5
    Membre habitué
    Homme Profil pro
    Lycéen
    Inscrit en
    Mai 2011
    Messages
    9
    Détails du profil
    Informations personnelles :
    Sexe : Homme
    Localisation : France, Vendée (Pays de la Loire)

    Informations professionnelles :
    Activité : Lycéen

    Informations forums :
    Inscription : Mai 2011
    Messages : 9
    Par défaut
    Oui mais je suis a un stade plutot avancé du programme donc oui j'utilise beaucoup jquery mais il ne reconnait pas les noeuds text et c'est un gros probleme j'en ai besoin
    mais merci

    EDIT : Merci !!

    J'ai réussit a faire ce que je voulait il manque plus qu'a ajouté le nom de class mais c'est du gâteau ça :p... pour ceux qui voudrait je met ce que j'ai fait :

    Code : Sélectionner tout - Visualiser dans une fenêtre à part
    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    		function ParseDOM(targetDocument, currentElement, depth){
     
     
    	    var j;
        var tagName=currentElement.tagName;
     
    	testchain2 += '<li>'+currentElement;
        // Traverse the tree
        var i=0;
        var currentElementChild=currentElement.childNodes[i];
        while (currentElementChild)
        {
    	testchain2 +='<ul>';
          // Recursively traverse the tree structure of the child node
          ParseDOM(targetDocument, currentElementChild, depth+1);
          i++;
          currentElementChild=currentElement.childNodes[i];
    	testchain2 +='</ul>'
        }
    	testchain2 += '</li>';
     
     
    	}

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

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