Compatibilité entre les différents navigateurs
Bonjour !
J'ai, dans une page HTML, un bouton select qui me permet (en JS) de charger un document XML dans un tableau HTML, lui même dans un <div id="destination">. Mon code est le suivant :
Code:
1
2
3
4
5
6
7
8
9
10
11
12
| <article>
<form name="formulaire">
<select name="select">
<option value="Caverner">Caverne</option>
<option value="Ville">Ville</option>
<option value="Mer">Mer</option>
</select>
<input type="button" value="Afficher" onclick="verification()" />
<input type="text" name="result" style="display:none;"/>
</form>
<div id="destination"></div>
</article> |
Et le JavaScript :
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
|
function verification()
{
var noeud = document.getElementById('destination');
while (noeud.childNodes.length>0) {
noeud.removeChild(noeud.firstChild);}
formulaire.result.value = formulaire.select.value+".xml";
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",formulaire.result.value,false);
xmlhttp.send();
xmlDoc=xmlhttp.responseXML;
// endroit on l'on va ajouter la TABLE
var oDest = document.getElementById('destination');
// Eléments manipulés
var oText, oCell, oRow, oTable = document.createElement('TABLE');
var x=xmlDoc.getElementsByTagName("BETE");
oRow = oTable.insertRow(); //Nouvelle ligne
oCell = oRow.insertCell(); //On y insère la première cellules.
oCell.setAttribute('colspan', 4); //On la met en colspan 2.
oText = document.createTextNode(formulaire.select.value); //On écrit dedans.
oCell.appendChild( oText); //Et on l'envoie.
for (i=0;i<x.length;i++) {
oRow = oTable.insertRow();
oCell = oRow.insertCell();
oText = document.createTextNode(i);
oCell.appendChild( oText);
oCell = oRow.insertCell();
oText = document.createTextNode(x[i].getElementsByTagName("NOM")[0].childNodes[0].nodeValue);
oCell.appendChild( oText);
oCell = oRow.insertCell();
oText = document.createTextNode(x[i].getElementsByTagName("TAILLE")[0].childNodes[0].nodeValue);
oCell.appendChild( oText);
oCell = oRow.insertCell();
oText = document.createTextNode(x[i].getElementsByTagName("POURCENTAGE")[0].childNodes[0].nodeValue);
oCell.appendChild( oText);
}
// ajout TABLE créée
oDest.appendChild( oTable);
} |
Mais il y a un problème...
Soit, ça ne marche que sur Firefox, soit ça me mets les lignes et les colonne dans le sens contraire...
J'ai quelques essaie, et je vois qu'en plus, dans un tableau quelconque, il y a un espace transparent (comme un padding) dans chaque cellule du tableaux.
