11550 sujets

JavaScript, DOM et API Web HTML5

[Résolu] Affichage dans page HTML de données venant d'un fichier XML

Pour que la fonction réalise ce que je veux je dois mettre une "pause" (alert) dans le code ci-après.
Comment faire pour supprimer cette "verrue".
J'ai essayé avec setTimeout et diverses "combines" sans y parvenir (niveau très faible en javascript).

function garde(){
	// Vérification si le navigateur gêre la méthode utilisée
	if (document.implementation && document.implementation.createDocument) {
		// déclaration pour Mozilla et Firefox
		docXml = document.implementation.createDocument('', '', null);
	}
	else if (window.ActiveXObject){
		// déclaration pour IE
		docXml = new ActiveXObject("Microsoft.XMLDOM");
	}
	else {
		alert('Votre navigateur ne sait pas exécuter ce script!');
	}
	// Fichier XML source
	docXml.load('garde.xml');
	
	////////////////////////////////////////////////
	alert('Pause obligatoire pour que ça marche!');
	////////////////////////////////////////////////

	// Initialisation du code HTML qui sera affiché dans le <div>.
	var html = '<h1>Tableau de permanence du Mardi</h1>';
	
	// Get a list of the <item> element nodes in the file
	var itemList = docXml.getElementsByTagName('item');

	// Loop through all <item> nodes
	for (var i = 0; i < itemList.length ; i++){
		// For each <item> node, get child nodes
		var nodeList = itemList.item(i).childNodes;
		// Loop through child nodes. Extract data from the text nodes.
		for (var j = 0; j < nodeList.length ; j++){
			var node = nodeList.item(j);
			if (node.nodeName == "title") {var date = node.firstChild.nodeValue;}
		}
		// Ajoute les données extraites dans le HTML string.
		html += "<i><b>";
		html += date;
		html += "</b></i><br /><br />";
	}
	// Affiche le code HTML dans le <div> 
	document.getElementById('content_div').innerHTML = html;
};


Cordialement
Modifié par cyrano25550 (24 Apr 2009 - 12:24)
Je n'utilise que jQuery pour ce genre de choses donc je ne pourrai rien coder pour toi mais je peux t'indiquer que le problème vient de docXml.load('garde.xml');

Le chargement du xml étant asynchrone au reste de ton script (c'est à dire que le script n'attend pas la fin du chargement du xml avant de continuer), il est normal qu'il te faille une pause.

La seule manière viable de gérer ton problème est de mettre un événement qui "écoute" la fin du chargement contenant le reste de ton script (le parsing du xml, etc.)

Je ne sais pas comment on fait en js "classique" mais une recherche sur Google devrait t'aider.
Merci pour ton aide qui m'a permis de comprendre.
J'ai coupé la fonction en 2, je lance la suite après temporisation.
	// Temporisation obligatoire pour ça marche...
	setTimeout("gardeXML()",500);
C'est très bien si ça fonctionne.

Par contre tu devrais regarder du côté de load et addListener, attachEvent, etc. car si ton xml ne prend en fait que 200 ms à se charger, tu perds 300 ms à chaque fois, et inversement si il prend plus de temps que ça à charger, tu te retrouveras avec le même problème qu'au début.

Il faut que tu lances ton parsing seulement une fois que le xml est chargé et il existe des méthodes pour ça.
Suite aux remarques formulées par Skoua j'ai réussi à trouver comment lire le fichier dès que celui-ci est chargé (fonction du navigateur utilisé).
function loadXML() {
	// Méthode suivant navigateur
	if (document.implementation && document.implementation.createDocument) {
		docXml = document.implementation.createDocument('', '', null);
		docXml.load('bcm_html/resultats/__garde.xml?nocache=' + Math.random());
		docXml.onload = readXML;
	}
	else if (window.ActiveXObject){
		docXml = new ActiveXObject("Microsoft.XMLDOM");
		docXml.async = false;
	    docXml.onreadystatechange = verify;
		docXml.load('bcm_html/resultats/__garde.xml?nocache=' + Math.random());
	}
	else{
		alert('Votre navigateur ne sait pas exécuter ce script!');
	}
}

//		Pour Internet Explorer
function verify() {
	if (docXml.readyState == 4) { 
        readXML(); 
    } 
}
A la fin du chargement exécution de la fonction readXML...
Sujet clos
Aller à