Récupération contenu <div>

Version imprimable

23/04/2014, 16h31
Kazumi

Récupération contenu <div>
Bonjour,

j'ai un fichier html qui se sert d'un fichier xls pour mettre en forme et récupérer des données xml comme ceci :

Code:

<body onload="transform(loadXML(nom), loadXML('index.xsl'), 'transform')">

J'aimerai maintenant récupérer le contenu de cet div, j'essaye donc ainsi :
Code:

1 2 3 4 5 <script type="text/javascript"> var elt = document.getElementById("transform"); alert(elt.innerHTML); </script>
Le problème c'est que cela ne me retourne rien, j'en conclus donc que la div n'a pas eu le temps de se charger ?

Merci d'avance
23/04/2014, 16h57
Kazumi

1 pièce(s) jointe(s)

j'utilise une solution de secours qui consiste à lancer ma fonction par le OnClick d'un bouton. Le résultat est bon :

Pièce jointe 143791

J'aimerai maintenant ne récupérer que ce qu'il se trouve à l'intérieur des balises <VAR1> et <VAR2>. Existe t-il une fonction js qui le permet ?
23/04/2014, 16h59
SylvainPV

Citation:

Envoyé par Kazumi

j'en conclus donc que la div n'a pas eu le temps de se charger ?

Exactement. Le chargement de tes fichiers est une opération asynchrone, ton script va s'exécuter avant la fin des requêtes. Pour exécuter ton code au moment où la requête est terminée, il faut te brancher à un callback ou à un évènement. Ta fonction loadXML en propose très certainement un.

Pour récupérer le bout de HTML que tu veux, utilise les mêmes APIs JavaScript que celles dont tu te sers pour sélectionner ta <div> : querySelector, children...
Attention toutefois, je pense que tu essaies de manipuler du XML comme du HTML, or var1 et var2 ne sont pas des balises HTML valides. Es-tu sûr d'avoir besoin d'ajouter ce code au document ?
24/04/2014, 09h39
Kazumi

Citation:

Envoyé par SylvainPV

il faut te brancher à un callback ou à un évènement. Ta fonction loadXML en propose très certainement un.

Par le biais d'un setTimeout ? Car si c'est le cas, toutes mes tentatives d'utilisation d'une fonction avec un setTimeout se sont soldés par un échec.

Citation:

Envoyé par SylvainPV

Attention toutefois, je pense que tu essaies de manipuler du XML comme du HTML, or var1 et var2 ne sont pas des balises HTML valides. Es-tu sûr d'avoir besoin d'ajouter ce code au document ?

J'identifie le contenue que je souhaite récupérer dans le méandre d'information que je récupère pour ensuite pouvoir le traiter, j'avais dans la tête d'utiliser une fonction js ressemblant au split() me permettant de ne récupérer que les éléments entre les balises souhaitées.

P.S. Si je pouvais éviter le jQuery, les clients aiment pas trop
24/04/2014, 11h02
produnet

Salut,
Pour récupérer un morceau de cette longue chaine, il n'y a pas une fonction javascript qui fait ça il me semble ?
"Extraire une sous-chaine d'une chaine", mais il faut lui indiquer l'index de la sous-chaine dans la chaine.
Pour obtenir cet index il faut utiliser une autre fonction de javascript qui te fournit cet index si tu lui donne en parametre le nom de la sous-chaine, par exemple tu peux lui donner le nom <var1> et ainsi calculer l'index de la sous-chaine que tu cherches, ensuite donner cet index à la fonction d'extraction de sous-chaine.

Peut-être que je suis à coté de la plaque dans ma réponse ?

EDIT : Ah je vois qu'il y a beaucoup de var1 donc ça va être dur^^
24/04/2014, 11h24
Kazumi

Ce que je veux, c'est récupérer tous les éléments contenus entre les balises <var1> ... </var> puis de même pour <var2> ... </var2>
Le reste du texte, je ne m'en occupe pas.

Citation:

Envoyé par Kazumi

Par le biais d'un setTimeout ? Car si c'est le cas, toutes mes tentatives d'utilisation d'une fonction avec un setTimeout se sont soldés par un échec.

un timeout sert à attendre un certain délai, or tu n'as aucune idée du temps que va prendre ta requête. Je parle d'une fonction callback telle que xmlHttpRequest.onload :
Code:

1 2 3 4 5 6 7 8 9 function callback(){ alert("Le serveur a répondu : "+this.responseText); } var req = new XMLHttpRequest(); req.onload = callback; req.open("get", "tonfichier.xml", true); req.send();

24/04/2014, 13h53
Kazumi

Le bout de code que tu m'as donné va donc attendre que mon fichier XML soit chargé ?

Et puis-je mettre une variable pour le nom du fichier xml ?

merci d'avance
24/04/2014, 17h55
SylvainPV

Oui, comme son nom l'indique, le callback onload sera appelé quand la réponse à la requête sera chargée.

Ta fonction loadXML doit certainement te permettre de te brancher sur ce onload d'une façon ou d'une autre.
24/04/2014, 18h49
NoSmoking

Bonjour,
en parlant de bout de code et si tu nous montrais la fonction que tu utilises la fameuse transform(loadXML(nom), loadXML('index.xsl'), 'transform') !

La fonction transform() :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
function transform(xml, xsl, id) { 
        try { 
          // navigateur basé sur Gecko 
          if (window.XSLTProcessor){ 
            var fragment; 
            var xsltProcessor = new XSLTProcessor(); 
            xsltProcessor.importStylesheet(xsl); 
            fragment = xsltProcessor.transformToFragment(xml, document); 
            var target = document.getElementById(id); 
            target.appendChild(fragment); 
            document.appendChild(target); 
          // ActiveX pour Internet Explorer 
          } else if (window.ActiveXObject) { 
            var target = document.getElementById(id); 
            target.innerHTML = xml.transformNode(xsl); 
          } 
        } catch (e) { 
          return e; 
        } 
      }

Et la fonction loadXML() :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
 function loadXML(url) { 
        var xmlDoc; 
        /* chargement du fichier XML */ 
        try { 
 
          // navigateur basé sur Gecko 
          if (window.ActiveXObject) { 
            try { 
              xmlDoc = new ActiveXObject('Msxml2.XMLDOM'); 
            } catch (e) { 
              xmlDoc = new ActiveXObject('Microsoft.XMLDOM'); 
            } 
            xmlDoc.async = false; 
            xmlDoc.load(url); 
          // à l'aide de lobjet XMLHTTPRequest 
          } else if (window.XMLHttpRequest) { 
            xmlDoc = new XMLHttpRequest(); 
            xmlDoc.overrideMimeType('text/xml'); 
            xmlDoc.open('GET', url, false); 
            xmlDoc.send(null); 
            if (this.xmlDoc.readyState == 4) xmlDoc = xmlDoc.responseXML; 
          } 
        } catch (e) { 
          return e; 
        } 
        return xmlDoc; 
      }

Comment puis-je donc brancher un timer sur l'une de ces fonctions ?

25/04/2014, 13h51
SylvainPV

Ok donc tu peux reprendre le code que je t'ai montré précédemment pour l'adapter à ta fonction loadXML. Ici ce sera :

Code:

xmlDoc.onload = callback;

Puis tu rajoutes callback en second argument de la fonction
25/04/2014, 14h01
Kazumi
Si je t'ai bien compris :
Code:

1 2 3 4 5 function callback(){ //Instructions une fois le XML chargées } xmlDoc.onload = callback;
et je rajoute callback en second argument de ma fonction loadXML c'est bien ça ?
25/04/2014, 16h03
produnet

Ta longue chaine retournée et plein de DIVs nommés "VAR1" il est possible d'en extraire ces div, en utilisant :

Code:

mondiv=document.getElementsByName("VAR1"); // ça retourne un tableau mondiv de tous les div portant ce nom.

Si je suis à coté de la plaque, dis-le moi ;)
25/04/2014, 17h01
SylvainPV

@Kazumi: oui c'est bien ça
28/04/2014, 13h47
Kazumi

Le problème est que la fonction LoadXML est dans un fichier js à part que j'inclus dans ma page html.

Donc quand je fais le xmlDoc.onload = callback; il me dit que xmlDoc est indéfini :/
28/04/2014, 15h49
Kazumi

1 pièce(s) jointe(s)
Code:

1 2 3  var xmlDoc = new XMLHttpRequest(nom); xmlDoc.onload = callback;
nom contenant le chemin complet du fichier xml :
Pièce jointe 144289

Et j'ai rajouté en argument la fonction callback ;

Code:

<body onload="transform(loadXML(nom), loadXML('index.xsl',callback), 'transform');">

Code:

function loadXML(url,callback)

Et dans ma fonction callback je fais juste un alert mais cela ne fonctionne pas, des idées ? :/
29/04/2014, 09h52
Bovino

Faire des requêtes AJAX sur des fichiers locaux, c'est la garantie que tu vas avoir des problèmes !
Utilises un serveur local (type Wamp) et fais tes requêtes sur ce serveur.