Lecture d'un fichier XML avec JQuery

**MGD_Software** · 24/01/2015, 13h16

Bonjour,

NB: J'ai déjà posté cette discussion sur le forum XML, mais il me semble que celui-ci est plus adapté au problème.

Je suis en train de développer une galerie de photos en JQuery (v1.11.2). Tous les paramètres de la page seront définis dans un fichier XML généré par une application externe, qui pour l'instant est écrit à la main.
Lorsque j'exploite le fichier XML, Internet explorer plante sauvagement, tandis que Firefox et Chrome font le boulot.

Cependant, dans la console de Firefox, je trouve un certain nombre de lignes "Mal formé", avec un nombre d'occurences (sans autre explication ni référence de ligne).
Dans internet explorer, j'ai placé des couples try/catch pour trouver l'erreur. Le résultat est :

TypeError : impossible d'obtenir la propriété "replace" d'une référence null ou non définie.

Pourtant mon fichier XML me semble au carat. D'ailleurs s'il ne l'est pas (j'ai essayé), j'ai le message d'erreur du $.get dans tous les navigateurs.
Il semblerait que le problème se situe au niveau du .find() : il y a autant d'erreurs que de lignes ou figurent un ou plusieurs .find()
Quelqu'un a t-il une idée d'où provient l'erreur ? Je n'ai rien trouvé dans les FAQ qui ressemble à mon problème.
Et je (re)précise que dans Firefox et Chrome, tous mes paramètres sont parfaitement lus.

Pour info : IE : version 11.0.7, Firefox : Version 35.0, Chrome : Version 39.0.2171.99 m

Voici le code de lecture du fichier XML :

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
  var indexname = 'index.xml'
  $.get(indexname, null, null, 'xml')
  .success(readXML)
  .fail(function() { alert("Le fichier de description de l'album (" +   indexname + ")\nn'a pas été trouvé dans le répertoire de l'album\nou sa   structure est incorrecte.") });
 
...
function readXML(){
  var title = $(xml).find('common').find('title').html();
  var size = parseInt($(xml).find('common').find('slidesize').text());
  .....
  $(xml).find('album').find('slide').each(function(){
     var title = $(this).find('title').text();
     var file = $(this).find('file').text();
     var ratio = parseFloat($(this).find('ratio').text());
     ....
  }
}

Internet Explorer plante dès le premier find().

Voici le contenu (abrégé) du fichier XML :

Code xml :

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
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
<?xml version="1.0" encoding="utf-8"?>
<album>
    <common>
        <title>Titre album</title>
        <comment>Ceci est un album realisé entièrement en   JavaScript<br /><br />Il utilise JQuery et   WebAlbums</comment>
        <slidesize>240</slidesize>
        <legendabove>1</legendabove>
    </common>
    <styles>
        <body>
            <font-family>Verdana, Arial, Helvetica, sans-serif</font-family>
            <font-size>12px</font-size>
            <color>#000000</color>
            <background-color>#EEFFFF</background-color>
            <margin-top>0px</margin-top> 
        </body>
        <div-container>
            <margin>0 auto 0 auto</margin>
            <background-color>#FFF</background-color>
            <display>table</display>
        </div-container>
        <div-title>
            <text-align>center</text-align>
        </div-title>
        <div-comment>
            <text-align>justify</text-align>
        </div-comment>
        <class-vignette>
            <width>300px</width>
            <border-width>1px</border-width>
            <border-style>solid</border-style>
            <border-color>#CCC</border-color>
            <margin>5px</margin>
            <float>left</float>
            <text-align>center</text-align>
        </class-vignette>
    </styles>
    <slide>
            <title>Dome "1"</title>
            <file>Dome1.jpg</file>
            <ratio>0.667</ratio>
    </slide>
    <slide>
            <title>Dome à Fira (Santorin)</title>
            <file>Dome2.jpg</file>
            <ratio>1.5</ratio>
    </slide>
...
    <slide>
            <title>Rue à Pyrgos (Santorin)</title>
            <file>Rue3.jpg</file>
            <ratio>0.667</ratio>
    </slide>
</album>

**kakashi99** · 26/01/2015, 10h49

salut,

c'est une erreur de copier coller, ou t'as n'a vraiment pas d'argument pour "readXML()" ?

et IE plante, ok... mais quoi ? il freeze, il se ferme ? que dit la console ?

**MGD_Software** · 26/01/2015, 12h27

Effectivement, c'est une erreur de recopie.
La déclaration de la fonction est : readXML(xml)
Sinon, c'est sûr que ça ne peut pas fonctionner.
J'ai 35 ans d'expérience en informatique et je pense que j'aurais trouvé ce gag tout seul.

Pour IE, j'ai dit ce qui se passait : erreur de script, qui s'arrête net et ressort.
et la console dit :
TypeError : impossible d'obtenir la propriété "replace" d'une référence null ou non définie.

Je ne comprends pas le message d'erreur, je ne vois pas ce que concerne le "replace", ou la référence en question.
Je pense que l'erreur se situe dans le code de JQuery, mais je n'arrive pas à décortiquer le code super-compact et obscur de ce dernier pour trouver ce qui lui manque.

J'ai trouvé sur le web plusieurs références à cette erreur, mais aucune qui concerne le .find() de JQuery.
J'ai aussi testé mon fichier XML avec plusieurs browsers (dont les navigateurs internet), tous me sortent l'arborescence sans signaler d'erreur.

J'ai aussi essayé de remplacer

Code :

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

$(xml).find('common').find('title').html()

par

Code :

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

$(xml).find('album > common > title').html()

ce qui est beaucoup plus propre, mais le résultat est totalement identique: fonctionne sur firefox et Chrome (avec avertissement console) et ne fonctionne pas avec IE.

Je cale...

**SpaceFrog** · 26/01/2015, 12h42

a tout hasard

Code :

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

1
2
3
4
 
$($(xml)).find('common').find('title').html()
ou
xml.find('common').find('title').html()

Sinon essaye de passer par un $.ajax avec un dataTyp: 'xml'

**MGD_Software** · 26/01/2015, 13h56

$($(xml)).find('common').find('title').html() : me renvoie toujours un avertissement "Mal formé", mais Firefox me renvoie quand même la valeur, et IE plante
xml.find('common').find('title').html() : xml étant un objet XML et non un objet JQuery, il ne possède pas la méthode find() --> Erreur dans tous les navigateurs

Et j'ai déjà essayé ça (j'avais même commencé par ça) :

Code :

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

1
2
3
4
5
6
$.ajax({
  url: 'index.xml',
  data: null,
  success: readXML,
  dataType: 'xml'
});

J'ai aussi essayé avec une chaîne vide au lieu de null pour data, sans résultat.
D'ailleurs le problème ne vient pas de la requête, mais du traitement de l'objet renvoyé.
Si je tape la requête dans la console, mais avec null au lieu de readXML, la requête s'exécute sans aucun avertissement.
J'ai aussi essayé en retirant tous les espaces et retours-chariots inutiles dans le fichier, sans résultat sinon un fichier illisible à l’œil.

JQuery.find() ne serait pas adapté à une recherche dans du XML ???

**kakashi99** · 26/01/2015, 15h06

[EDIT]

sous IE11, ça ça fonctionne:

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
 
function readXML(xml){
  var title = $(xml).find('album').find('common').find('title').text();
  var size = parseInt($(xml).find('common').find('slidesize').text());
 
  $(xml).find('album').find('slide').each(function(){
     var title = $(this).find('title').text();
     var file = $(this).find('file').text();
     var ratio = parseFloat($(this).find('ratio').text());
 
  });
}
 
$.ajax({
  url: './test.xml',
  data: null,
  success: readXML,
  dataType: 'xml'
});

Lecture d'un fichier XML avec JQuery

jQuery

Vue hybride

Discussions similaires

Partager

Partager