DOM : node et attributes

**r83** · 30/09/2009, 23h36

Bonsoir,

Je n'arrive pas à afficher les attributs d'un noeud. Soit il me les affiche tous et il y en a 136, soit aucun.
Voici le code

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
 
function fMesAttributs()
{
	var  lesAttributs= document.getElementById("btnAttributs").attributes;
	var message= "Les " + lesAttributs.length + " attributs du bouton sont : \n";
	for(var i=0;i<lesAttributs.length;i++)
	{
		if(lesAttributs[i].Value != null)
		message+=lesAttributs[i].name  +"   " +lesAttributs[i].value + "\n"; 
	}
	alert(message );
}

Je ne pense pas que ce soit une erreur algorithmique...
Je voudrais affiche uniquement ceux qui ne sont pas à null.
Merci pour les réponses

**sebhm** · 01/10/2009, 06h50

Bonjour,

j'aurais fait comme toi au départ...

mais sinon, ceci marche chez moi

Code :

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

1
2
3
4
5
6
7
8
9
10
11
  function fMesAttributs()
  {
  	var  lesAttributs= document.getElementById("textfield").attributes;
  	var message= "Les " + lesAttributs.length + " attributs du bouton sont : \n";
  	for(var i=0;i<lesAttributs.length;i++)
  	{
      att=lesAttributs.getNamedItem(lesAttributs[i].name);
      message+=lesAttributs[i].name+' = '+att.value + "\n";
  	}
  	alert(message );
  }

**r83** · 01/10/2009, 07h10

Bonjour,

Merci pour ta réponse, ton code fonctionne sous mozilla. par contre sous IE, tous les attributs sont renvoyés.
Quelle autre solution pourrait convenir sous OE, je n'ai plus d'idées.
Bonne journée

**sebhm** · 01/10/2009, 08h50

ah oui !

ben on peut toujours réduire la liste avec des tests du style

Code :

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

if (att.value != "null" && att.value != "")

mais c'est vrai qu'on devrait pouvoir récupérer les attributs mis dans le code ... je ne sais pas le faire

**sebhm** · 01/10/2009, 09h01

un peu d'aide là pour le cross browser
apparemment pas simple pour les attributs...
mieux vaut savoir lequel on veut

**Bovino** · 01/10/2009, 12h01

Salut,

Code :

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

if(lesAttributs[i].Value != null)

JavaScript étant sensible à la casse, un attribut n'a pas de propriété Value

Ensuite, puisque tu accèdes à l'attribut, c'est qu'il existe, il ne peut donc pas être null !
Donc :

Code :

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

if(lesAttributs[i].value)

vérifiera si la valeur de l'attribut est équivalent à false (en particulier, si c'est une chaine vide).

**r83** · 01/10/2009, 12h19

Désolé, mais

Code :

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

if(lesAttributs[i].value)

ne change rien, IE n'admet toujours pas et renvoie TOUS les attributs. Résultat OK sur Mozilla.
Bonne journée
BR

**Bovino** · 01/10/2009, 12h24

IE préfèrera peut-être nodeValue à value

**kimjoa** · 01/10/2009, 15h56

quand on passe par la variable attributes, de l'élément, toutes les valeur retourné sont des string, du coup les tests du genre !=false ect fonctionnent pas

Avec ie, touts les attributs sont accessibles comme propriété du nœud, donc le test va se faire par le nœud
de plus ie renvoie l'objet style, donc on l'enlevé aussi

voilà une fonction toute prète

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
 
<html>
 
<head>
<meta http-equiv="Content-Type" content="text/html; charset=windows-1252">
<title>getAttributes</title>
<script type='text/javascript'>
 
 var isIE = /msie/.test(navigator.userAgent.toLowerCase());//globale car tres utile (d ailleur detection super sipmliste)
 
 function getAttributes(el){
     var a = el.attributes, 
         l = a.length,
         r= {}, 
         i = 0, 
         n;
 
     for(; i < l; i++){
         n = a[i].name;
         if(!isIE){
             r[n] = a[i].value;
         }else if(n != 'style' && el[n]){alert(n+'+'+el[n]);
             r[n] = el[n];
         }
     }
     return  r;
 }
 
  </script>
</head>
 
<body>
<div id="test" border=0>test</div>
<script type='text/javascript'>
 
   alert(getAttributes(document.getElementById('test')).id);
</script>
</html>

reste encore un attribut, c'est contentEditable avec comme valeur par défaut inherit, a toi de voire ce que tu veux en faire

bye

DOM : node et attributes

JavaScript

Discussions similaires

Partager

Partager