[DOM] Création de noeud XML avec le DOM

**BkD35** · 06/12/2007, 11h58

Bonjour à tous,

voici mon probleme, après le chargement de ma page je recupère un fichier XML que je stock dans une variable.

Pour la sutie je souhaite traiter cette variable afin d'ajouter de modifier ou supprimer des neouds.

L'ajout d'un noeud serait sous la forme :

<article id="12">
<nom>un nouvelle article</nom>
<fournisseur>XXX</fournisseur>
</article>

Mon code est donc le suivant :

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
 
var nouvelleArticle = document.createElement('article');
nouvelleArticle.setAttribute('id',art_id);
 
var art_nom = document.createElement('nom');
var nodeValue = document.createTextNode("Nouvelle article");
art_nom.appendChild = nodeValue;
 
var art_fournisseur = document.createElement('fournisseur');
var nodeValue = document.createTextNode("XXX");
art_fournisseur.appendChild = nodeValue;
 
nouvelleArticle.appendChild(art_nom);
nouvelleArticle.appendChild(art_fournisseur);

Malheureusement cela n'a pas l'air d'être 100% fonctionnelle puisque quand je souhaite recupèrer les valeurs de ce noeud javascript génère une erreur.

Code :

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

1
2
3
4
5
 
function getValeur(noeud,nomPropriete) {
   var objNom = noeud.getElementsByTagName(nomPropriete);
   return objNom[indice].firstChild.nodeValue;
}

Or pour le nouveau noeuds crée il genere une erreur :

Code :

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

objNom[indice].firstChild has no properties

Si quelqu'un avait une petite idée.

Merci

**le_chomeur** · 06/12/2007, 12h52

Salut

je ne vois pas ou est déclaré "indice" :

Code :

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

1
2
3
4
function getValeur(noeud,nomPropriete) {
   var objNom = noeud.getElementsByTagName(nomPropriete);
   return objNom[indice].firstChild.nodeValue;
}

ici non plus :

Code :

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

objNom[indice].firstChild has no properties

par contre par rapport a ton code , j'ai fait ça rapidement ...

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
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
 
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Document sans nom</title>
<script type="text/javascript">
	function ajoutNoeud(){
	var art_id = document.getElementById('idNoeud').value;
	var nouvelleArticle = document.createElement('article');
	nouvelleArticle.setAttribute('id',art_id);
 
	var art_nom = document.createElement('nom');
	var nodeValue = document.createTextNode("Nouvelle article");
	art_nom.appendChild(nodeValue);
 
	var art_fournisseur = document.createElement('fournisseur');
	var nodeValue = document.createTextNode("XXX");
	art_fournisseur.appendChild(nodeValue);
 
	nouvelleArticle.appendChild(art_nom);
	nouvelleArticle.appendChild(art_fournisseur);
	document.getElementById('toto').appendChild(nouvelleArticle);
	alert(document.getElementById('toto').innerHTML);
	}
	function voirPropriete(){
		var art_id = document.getElementById('idNoeud').value;
		var noeud = document.getElementById(art_id);
		var objNom = noeud.getElementsByTagName('nom');
   		alert(objNom[0].firstChild.nodeValue);
	}
</script>
</head>
 
<body>
<div id="toto">
ici
</div>
 
<input type="text" id="idNoeud" value=""/>
<input type="button" value="Ajouter un noeud" onclick="ajoutNoeud()"/>
<input type="button" value="voir valeur du nom du noeud" onclick="voirPropriete()"/>
</body>
</html>

**BkD35** · 06/12/2007, 13h08

Bonjour le_chomeur,

Oui en effet pour indice j'ai repris ma fonction en enlevant quelque element pour simplifier le problème j'aurai du mettre

Code :

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

 objNom[0]

Cela dit merci pour ton aide, mais mes noeuds que je souhaite créer je ne veux pas les insérer dans du code HTML, mais dans une variable global javascript qui contient tout mon fichier XML, et c'est bien la le problème.

Merci

**le_chomeur** · 06/12/2007, 14h34

Houla , ça va se compliquer ^^
car a partir du moment ou tu fais un :
nouvelleArticle corespond a un noeud

monTableau.push(nouvelleArticle) ,

tu ne pourras plus utiliser les méthodes
noeud.getElementsByTagName(nomPropriete); et autre puis qu'il ne seront plus considèré comme des objets ... pour cela il faudrait que tu créer une méthodes ...

Bon courage pour la suite

**SpaceFrog** · 06/12/2007, 17h42

mets un div hidden dans ta page, tu pourras y coller tous les noeuds que tu veux avec du appendChild insertBefore etc ...

ensuite tu n'auras plus qu'a récupérer le innerHTML pour le coller dans une variable ...

ou encore avec un fragment mais je ne sais pas si c'est compatible avec FFX ...

**BkD35** · 07/12/2007, 12h09

bonjour,

Cette technique ne marchai pas , mais j'ai trouver un leurre, dans ma classe javascript j'ai ajouter une méthode qui permet de cloner un noeud existant que je renvoi, ensuite je n'ai plus qu'a modifier les valeurs et réinsérer ce nouveau noeud dans mon fichier XML.

Merci à vous

[DOM] Création de noeud XML avec le DOM

JavaScript

Discussions similaires

Partager

Partager