Récupération contenu <div>

**Kazumi** · 23/04/2014, 16h31

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 :

Sélectionner tout - Visualiser dans une fenêtre à part

 <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 :

Sélectionner tout - Visualiser dans une fenêtre à part

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

**Kazumi** · 23/04/2014, 16h57

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

Nom : Capturer.JPG
Affichages : 113
Taille : 26,1 Ko

Nom : Capturer.JPG
Affichages : 113
Taille : 26,1 Ko

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 ?

**SylvainPV** · 23/04/2014, 16h59

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 ?

**Kazumi** · 24/04/2014, 09h39

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.

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

**produnet** · 24/04/2014, 11h02

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^^

**Kazumi** · 24/04/2014, 11h24

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.

**SylvainPV** · 24/04/2014, 13h12

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 :

Sélectionner tout - Visualiser dans une fenêtre à part

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();

**Kazumi** · 24/04/2014, 13h53

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

**SylvainPV** · 24/04/2014, 17h55

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.

**NoSmoking** · 24/04/2014, 18h49

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') !

**Kazumi** · 25/04/2014, 09h38

La fonction transform() :

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
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 :

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
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 ?

**SylvainPV** · 25/04/2014, 13h51

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 :

Sélectionner tout - Visualiser dans une fenêtre à part

xmlDoc.onload = callback;

Puis tu rajoutes callback en second argument de la fonction

**Kazumi** · 25/04/2014, 14h01

Si je t'ai bien compris :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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 ?

**produnet** · 25/04/2014, 16h03

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

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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

**SylvainPV** · 25/04/2014, 17h01

@Kazumi: oui c'est bien ça

**Kazumi** · 28/04/2014, 13h47

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 :/

**Kazumi** · 28/04/2014, 15h49

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
  <!-- TIMER JS POUR SAVOIR QUAND LE FICHIER XML EST INTERPRETE -->
  var xmlDoc = new XMLHttpRequest(nom); 
  xmlDoc.onload = callback;

nom contenant le chemin complet du fichier xml :
Nom : Capturer.JPG
Affichages : 105
Taille : 17,5 Ko

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

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

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

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

function loadXML(url,callback)

Et dans ma fonction callback je fais juste un alert mais cela ne fonctionne pas, des idées ? :/

**Bovino** · 29/04/2014, 09h52

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.

Récupération contenu <div>

JavaScript

Discussions similaires

Partager

Partager