getElementsByName resultat différent sous Ie et Firefox

Version imprimable

Bonjour, je rencontre un problème dans le parcour des elements de ma page.

lapage suivant comporte 9 div et un bouton. Le code du bouton permet de lister toutes les div. Ce code fonctionne sous firefox, mais pas sous ie ?

quelqu'un peut-il m'eclairer ?

Merci

Voici le code

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
 
<html>
<head>  
  <style type="text/css">
  .carrebleu {
     border: solid 1px;
     border-color: silver;
     padding: 5;
 
     background-color: #0050FF;
     color: white;
 
     position: absolute;
     cursor: default;
 
    width: 100px;
    height: 100px;
 }
 </style>
 
 </head>
  <body>
 
 <nobr><div id="toto" name="moveable" class="carrebleu" style="left:25;top:25;">1</div></nobr>
 <nobr><div name="moveable" class="carrebleu" style="left:125;top:25;">2</div></nobr>
 <nobr><div name="moveable" class="carrebleu" style="left:225;top:25;">3</div></nobr>
 <nobr><div name="moveable" class="carrebleu" style="left:25;top:125;">4</div></nobr>
 <nobr><div name="moveable" class="carrebleu" style="left:125;top:125;">5</div></nobr>
 <nobr><div name="moveable" class="carrebleu" style="left:225;top:125;">6</div></nobr>
 <nobr><div name="moveable" class="carrebleu" style="left:25;top:225;">7</div></nobr>
 <nobr><div name="moveable" class="carrebleu" style="left:125;top:225;">8</div></nobr>
 <nobr><div name="moveable" class="carrebleu" style="left:225;top:225;">9</div></nobr>
 
 
  <input type='button' name="moveable" style="position:absolute;left:500;top:500;width: 110px; height: 110px;" onclick="example8('moveable');" >
 
 
  <script>  
	function example8(which){  	
 
 
	  	var elts = document.getElementsByName(which);
	  	alert(elts.length);
		var msg = ['Utilisation de getElementsByName avec l\'attribut '+which+'\n'];
		for (var i=0,el;el=elts[i];i++) {
			  msg[msg.length] = '\n=========== node #'+i+' ===========\n';
			  msg[msg.length] = "el.nodeName -> "+ el.nodeName + "\nel.value -> "+ el.value + "\nel.id -> "+ el.id +"\nel.checked -> "+ el.checked +"\n";
		}
		alert( msg.join(' ') );
	}	
</script>
 
  </body>
 </html>

21/08/2006, 15h44
FremyCompany

Dans IE,seuls les objets INPUT, BUTTON, TEXTAREA, ... peuvent être récupéré via leur nom (et ca me semple plutot normal, vu que pour l'attribut nom a été créé pour eux et pas pour d'autre types de balises)
21/08/2006, 15h46
garfield657

ok, merci
Mais alors comment faire pour récuperer les div, et les modifier ?
21/08/2006, 15h48
ldcarpathes

Code:

getElementsByTagName("div");

il me semble
21/08/2006, 15h53
garfield657

ok merci beaucoup, ce n'est pas tres elegant comme méthode, vu que ça m'oblige a parcourir tout les elements de ma page et a tester
chaque element pour voir si name="moveable". Mais ça me débloque quand même.
Merci a tous

Code:

document.getElementById("ID")

Ou si tu tiens à passer par name :

Code:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
document.getByName = document.getElementsByName;
document.getElementsByName=function(name,tag) {
    var results=null;
    tag=(tag)?tag:"*";
    if (document.all) {
       results=new Array();
       var all=document.getElementsByTagName(tag);
       for (var i=0; i<all.length; i++) {
           if (all[i].name==name) { results.push(all[i]); }
       }
    } else {
       var all = document.getByName(name);
       if (tag != "*") { 
          results=new Array();
          for (var i=0; i<all.length; i++) {
              if (all[i].tagName.toLowerCase() == tag.toLowerCase()) {
                  results.push(all[i]);
              }
          }
       } else {results=all;}
    }
    return results;
}

Il y a peut-être des fautes à corriger, j'ai tapé ca vite-vite...

Utilsation :

Code:

1
2
3
4
5
6
7
8
9
// Résultat de type FF (Dans IE & FF)
var r = document.getElementsByName("name");
 
// Résultat de type IE (Dans IE & FF)
r = (document.getElementsByName("name", "input")
                  .concat(document.getElementsByName("name", "textarea"))
                  .concat(document.getElementsByName("name", "button"))
                  .concat(document.getElementsByName("name", "img"))
                  );

21/08/2006, 15h58
garfield657

super merci beaucoup :D
21/08/2006, 16h23
garfield657

c'est vu, j'ai modifié le code.
merci

PS: je suis en train de faire un petit drag and drop maison, ça vous interesse ?
21/08/2006, 16h25
SpaceFrog

non :mrgreen:

y'en a déja plein les propositions de code source ...
mais tu peux y aller de ta contribution, si jamais tu réinventes le fil à coupeur l'eau tiède ... :lol: