Parser sélectivement du XML (ou quelque chose y ressemblant) avec un JS
Bonjour,
je ne suis pas informaticien, mais
j'ai construit quelques sites d'associations (à but non lucratif) et autres (par exemple, une revue scientifique en accès libre, donc gratuit), sites que je maintiens et essaie d'améliorer.
Pour certains j'ai pu utiliser du PHP et des bases MySQL (j'arrive à me débrouiller pour écrire des fichiers .inc et .php, mais ce sont mes collègues informaticiens qui s'occupent de la partie server ...).
Pour d'autres je ne peux utiliser que du HTML (ni PHP, ni PERL, ni ASP, ...). Alors, des fois, je "bricole" un peu javascript et en combinant des morceaux de codes j'arrive à réaliser des "petits trucs" qui me sont bien utiles.
Bien sûr on peut se sentir un peu bridé par le fait de ne pas disposer d'une base de données server-based mais ça amène à chercher (et éventuellement trouver) des solutions ailleurs ... et en l'occurrence à chercher comment faire qu'un outil de type base de données puisse fonctionner sur un PC ou à partir d'un CD/DVD sansse connecter à un server extérieur. La revue scientifique sort une fois par an en DVD et si je veux inclure une base de données celle-ci doit-être une "flat database" ("mes excuses" si je ne suis pas au top pour le vocabulaire) et non une database interrogeant un serveur extérieur ...
J'ai donc construit un document en XML (ou y ressemblant) avec quelques 7600 entrées et j'avais pensé à coller et modifier des bouts de codes "glanés" sur le net pour obtenir une espèce de parser :
me permettant d'afficher la donnée correspondant à un numéro d'ordre sur les 7600 (affichage = auteur, année de publication, titre), puis en cliquant dessus un résultat développé (affichage = auteur, année de publication, titre, référence, résumé, mots-clefs) ;
me permettant de naviguer en avant ou en arrière, la donnée suivante ou la précédente, puis 5 en avant ou en arrière, puis de 20 en avant ou en arrière. Cette base de donnée servira à illustrer un article sur des coraux et éponges FOSSILES (vous voyez que mes domaines de compétence sont assez éloignés de l'informatique !).
J'ai fait un truc : CA MARCHE sur Firefox,
http://paleopolis.rediris.es/cg/test/browse_test.html
mais pas sur Chrome (ni Safari). La console java de Chrome me donne des infos (4 erreurs) mais je suis incapable de les comprendre (c'est du Chinois pour moi !). Le fichier FCnP.xml est au même niveau que le browse_test.html ...
Quelqu'un peut-il m'aider ?
Voici le code :
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 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 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 110 111 112 113 114 115 116 117 118 119 120 121 122 123 124 125 126 127 128 129 130 131 132 133 134 135 136 137 138
| <!DOCTYPE html>
<html>
<head>
<script language="javascript1.3">
if (window.XMLHttpRequest)
{// code for IE7+, Firefox, Chrome, Opera, Safari
xmlhttp=new XMLHttpRequest();
}
else
{// code for IE6, IE5
xmlhttp=new ActiveXObject("Microsoft.XMLHTTP");
}
xmlhttp.open("GET","FCnP.xml",false);
xmlhttp.send();
xmlDoc=xmlhttp.responseXML;
x=xmlDoc.getElementsByTagName("RECORD");
i=0;
function displayCD()
{
id=(x[i].getElementsByTagName("ID")[0].childNodes[0].nodeValue);
artist=(x[i].getElementsByTagName("AUTHORS")[0].childNodes[0].nodeValue);
year=(x[i].getElementsByTagName("YEAR")[0].childNodes[0].nodeValue);
title=(x[i].getElementsByTagName("TITLE")[0].childNodes[0].nodeValue);
txt= id + " - Author(s): " + artist + "<br>Year: "+ year + "<br>Title: " + title;
document.getElementById("showCD").innerHTML=txt;
}
function displayCDInfo()
{
artist=(x[i].getElementsByTagName("AUTHORS")[0].childNodes[0].nodeValue);
year=(x[i].getElementsByTagName("YEAR")[0].childNodes[0].nodeValue);
title=(x[i].getElementsByTagName("TITLE")[0].childNodes[0].nodeValue);
source=(x[i].getElementsByTagName("SOURCE")[0].childNodes[0].nodeValue);
abstr=(x[i].getElementsByTagName("ABSTRACT")[0].childNodes[0].nodeValue);
fcnp=(x[i].getElementsByTagName("FCnP")[0].childNodes[0].nodeValue);
subject=(x[i].getElementsByTagName("SUBJECT")[0].childNodes[0].nodeValue);
syst=(x[i].getElementsByTagName("SYST")[0].childNodes[0].nodeValue);
strat=(x[i].getElementsByTagName("STRAT")[0].childNodes[0].nodeValue);
geog=(x[i].getElementsByTagName("GEOG")[0].childNodes[0].nodeValue);
txt= artist + " (<b>" + year + "</b>).- " + title + "- " + source + " - <b>FC&P:</b> " + fcnp + "<br><b>Abstract:</b> " + abstr + "<br>Topic(s): " + subject + "<br>Systematics: " + syst + "<br>Stratigraphy: " + strat + "<br>Geography: " + geog;
document.getElementById("showCD").innerHTML=txt;
}
function next()
{
if (i<x.length-1)
{
i++;
displayCD();
}
}
function previous()
{
if (i>0)
{
i--;
displayCD();
}
}
function next5()
{
if (i<x.length-1)
{
i+=5;
displayCD();
}
}
function previous5()
{
if (i>5)
{
i-=5;
displayCD();
}
}
function next20()
{
if (i<x.length-1)
{
i+=20;
displayCD();
}
}
function previous20()
{
if (i>20)
{
i-=20;
displayCD();
}
}
function goForit()
{
if (i<6708)
{
i=+this.document.testform.inputbox.value;
displayCD();
}
}</script>
</head>
<body onload="displayCD()">
<script language="javascript1.3">
document.write("<p>");
if (i==0)
{
document.write("<div id='showCD' onclick='displayCDInfo(" + i + ")'></div>");
}
else
for (var i=1;i<x.length;i++)
{
document.write("<div id='showCD' onclick='displayCDInfo(" + i + ")'></div>");
}
document.write("</p>");
</script>
<form name="testform">
<input type="button" onclick="previous20()" value="-20" />
<input type="button" onclick="previous5()" value="-5" />
<input type="button" onclick="previous()" value="-1" />
<input type="text" name="inputbox" value="" size="5">
<input type="button" name="Enter" Value="Enter" onClick="goForit(this.form)">
<input type="button" name="Reload" value="Reload" onClick="window.location.reload()">
<input type="button" onclick="next()" value="+1" />
<input type="button" onclick="next5()" value="+5" />
<input type="button" onclick="next20()" value="+20" />
</form>
</body>
</html> |
Si on pouvait régler ce disfonctionnement je pense que cette association simple de fonctionnalités pourrait être exploitée à d'autres occasions (à des fins scientifiques ou non).
Merci par avance pour votre temps et votre compréhension.
Bien à vous,
BG
bon ben je suis désolé mais c'est du Chinois pour moi
Bonjour,
je vous remercie pour vos conseils mais, s'il vous plaît, pensez que vous vous adressez à un "amateur" ... je ne comprends pas grand chose à votre jargon ... pensez-y quand vous vous adressez à un "nul" comme moi =)
Je peux vous donner un exemple de mon jargon (dans ma spécialité) : "Palorbitolina est un genre de foraminifère benthique à test agglutiné connu du Barrémien à l'Aptien inférieur. L'embryon complexe localisé au sommet du cône ..."
Si ça vous laisse perplexe ... sachez que je suis tout aussi perplexe devant les commentaires de la console java de Chrome ou vos suggestions !
Ceci dit,
concernant votre commentaire
"le pourquoi du if tu fais exactement la même chose dans le cas 0 que dans tous les autres"
j'ai fait un essai suivant votre suggestion et ça ne marche plus, même pour Firefox
donc ça doit bien être utile à quelque chose
pour le id du div, je corrige comme ça
Code:
1 2 3 4
|
{
document.write("<div id='showCD(" + i + ")' onclick='displayCDInfo(" + i + ")'></div>");
} |
Je n'ai pas besoin d'un code parfait. J'ai juste besoin d'un truc qui marche
Si l'un d'entre vous veut bien corriger le code "grossier"/"horrible" existant, ce serait super ...
Si vous aviez une "belle" solution alternative, merci de la proposer aussi !
Comme c'est destiné à une publication scientifique (en accès libre, je rappelle) et comme les auteurs mettent souvent/toujours des remerciements ... la/les personne/s qui aura/ont aidé à fixer figurera/ont dans ces remerciements (ce sera la moindre des choses !).
=] BG
résolu, tout seul (ou presque) ... pas élégant mais ça marche
bon en fait en changeant
Code:
document.write("<div id='showCD' onclick='displayCDInfo(" + i + ")'></div>");
pour
Code:
document.write("<div id='showCD(" + i + ")' onclick='displayCDInfo(" + i + ")'></div>");
ça fonctionne sur Chrome aussi
:ccool:
ceci dit si vous avez une solution élégante qui fonctionne sur toutes les navigateurs PC ou Mac
je suis toujours "preneur"
Ciao,
Bruno
Je vous remercie pour vos efforts
bon ben j'ai essayé de copier votre code, de remplacer là où il fallait le faire ... et j'obtiens une page blanche ...
En plus si je comprends un peu, je ne comprends pas tout.
Merci quand même d'avoir essayé
Bruno =)
messages d'erreur de la console (c'étaient avant !)
Concernant les messages d'erreur de la console
c'étaient
Citation:
Uncaught TypeError: Cannot call method 'getElementsByTagName' of null browse.js:18
Uncaught ReferenceError: x is not defined display.js:12
Uncaught ReferenceError: x is not defined browse.js:23
Uncaught ReferenceError: x is not defined browse.js:23