Afficher arbre DOM Complet avec "branches" [Résolu]

[PoMpOmWoNdErFuL]

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 :

Array([KEY] => value,[KEY2] => Array([KEY] => value) ... )

J'ai donc essayé de parcourir le dom en utilisant la recursivité :

Code :

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.

[SpaceFrog]

http://www.permadi.com/tutorial/domTree/index.html

[PoMpOmWoNdErFuL]

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

[SpaceFrog]

jquery ...

jette un oeil sur les selecteurs de jquery

[PoMpOmWoNdErFuL]

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 :

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>';
 
 
	}