Transformer un flux xml en une table html via javascript

Commenter

Contenu du snippet

Sur le modèle de ma source précédente (qui transforme une matrice JS en TABLE HTML) voici une fonction qui se "nourrit" d'un objet XML pour créer la TABLE!
Le flux XML doit être obtenu au préalable: HTTPrequest, Datawebservice, à vous le choix pour obtenir un objet XML au sens javascript qui contient les données à afficher. XMLnode est cet objet.
NodeName contient le nom des noeuds "enfants" à récupérer
attrName est un tableau (array) des attributs à afficher dans la table, ce tableau remplis également l'entête de la TABLE.
Le résultat est un objet TABLE à ajouter dans votre page à l'aide de appendChild (comme ma source précédente donc).

La fonction ValeurAttribut permet de récupérer un attribut XML à la fois pour IE et FF.

Source / Exemple : 


// génère un tableau HTML sur la base d'un noeud XML, le nom des noeuds qu'on veut extraire, 
// et la liste des attributs contenant les données
// XMLnode : objet XML noeud à parcourir
// NodeName : nom des noeuds à rechercher
// attrName = array des noms d'attributs à rechercher
// return : objet table à ajouter (appendChild)
function CreateTableFromXMl(XMLnode, NodeName, attrName) {
	var elts = XMLnode.getElementsByTagName(NodeName);
	if (!elts) return; // rien si vide
	
	var tbl = document.createElement("TABLE");
	tbl.setAttribute("border", 1);
	var tr = document.createElement("TR");
	var tbody=document.createElement("TBODY");
	var thead=tbl.createTHead();
	var tfoot=tbl.createTFoot();	

	var n=attrName.length;
	for (var j = 0; j < n; j++) {
		var td = document.createElement("TH");
		td.appendChild(document.createTextNode(attrName[j]));
		tr.appendChild(td);
	}
	thead.appendChild(tr);
	
	m = elts.length;
	for(var i = 1; i < m; i++){
		var tr = document.createElement("TR");
		for(var j = 0; j < n ;j++){
			var td=document.createElement("TD");
			td.appendChild(document.createTextNode(ValeurAttribut(elts[i], attrName[j])));
			tr.appendChild(td);
		}
		tbody.appendChild(tr);	
	}
	
	tbl.appendChild(thead);
	tbl.appendChild(tfoot);
	tbl.appendChild(tbody);
	return tbl;
}

function ValeurAttribut(noeud, attribut) {
  if (!noeud) return "";
  if ((!attribut) || (attribut=="")) return "";
  if (noeud.getAttribute(attribut)) return noeud.getAttribute(attribut);
  if (noeud.attributes[attribut]) return noeud.attributes[attribut].value;
  return "";
}

A voir également

S'inscrire maintenant

Vous n'êtes pas encore membre ?

inscrivez-vous, c'est gratuit et ça prend moins d'une minute !

Les membres obtiennent plus de réponses que les utilisateurs anonymes.

Le fait d'être membre vous permet d'avoir un suivi détaillé de vos demandes et codes sources.

Le fait d'être membre vous permet d'avoir des options supplémentaires.

Du même auteur (pifou25)