balise div non visible par getElementById

**bluemartini** · 19/05/2010, 16h21

Salut,

Je suis en train de me former à javascript, et je galère sur un cas qui me semble simple depuis une journée maintenant...

voici mon code HTML :

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
<HTML>
<HEAD>
	<link rel="stylesheet" href="css/style.css" type="text/css" media="screen" />
	<script type="text/javascript" src="javascript/prototype.js"></script>
 
<TITLE> in dev </TITLE>
</HEAD>
<BODY>
 
 
<FORM name="administrative" method="post" action="#">
		species : <SELECT name="species" id="choiceSpecies" onfocusin="population.populate_species()">
				<OPTION value="NA">NA</OPTION>
				<div id="speciesOptions" >
					<OPTION value="NA">NA</OPTION>
				</div>
			  </SELECT>
 
 
 
		<br/><input id="data" autocomplete="off" size="83" type="text" value="" onfocusin="population.populate_data()"/>
 
</FORM>
<script type="text/javascript" src="js_code.js"></script>	
 
</BODY>
</HTML>

et voici mon code javascript :

Code :

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

1
2
alert(document.getElementById('choiceSpecies')[0].nodeType);
alert(document.getElementById('speciesOptions')[0].nodeType);

Le résultat : j'ai le type de la balise SELECT qui est affiché, mais javascript ne retourne rien pour le deuxieme appel, concernant le type de la balise div.

Quelqu'un saurait me dire pourquoi?
merci!

**SpaceFrog** · 19/05/2010, 17h28

contrairement à getElementsByName ou getElementsByTagName getElementById ne retourne pas une collection puisque un id est unique sur la page ...
On remarquera dans la syntaxe l'absence de pluriel à Element ...

Code :

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

alert(document.getElementById('choiceSpecies').nodeType);

**bluemartini** · 19/05/2010, 17h36

merci pour ta réponse!
Effectivement la notation d'accès au tableau était en trop.
Cependant, cela ne résout pas le problème. En simplifiant mon code :

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
<HTML>
<HEAD>
	<script type="text/javascript" src="javascript/prototype.js"></script>
	<TITLE> in dev </TITLE>
</HEAD>
<BODY>
 
<FORM name="administrative" method="post" action="#">
		species : <SELECT name="species" id="choiceSpecies">
				<OPTION value="NA">NA</OPTION>
				<div id="speciesOptions" >
					<OPTION value="NA">NA</OPTION>
				</div>
			  </SELECT>
 
 
</FORM>
<script type="text/javascript">
	alert(document.getElementById('speciesOptions').nodeType);
</script>	
 
</BODY>
</HTML>

aucun message s'affiche.

**Auteur** · 19/05/2010, 18h22

bonjour;

Code html :

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

1
2
3
4
 
				<div id="speciesOptions" >
					<OPTION value="NA">NA</OPTION>
				</div>

On ne peut pas encadrer de balise option d'un div ni même écrire une balise HTML dans une balise option.

En passant : écris toutes tes balises HTML en minuscules, sinon ça ne passe pas la validation W3C.

**bluemartini** · 20/05/2010, 10h35

Merci beaucoup!

Effectivement c'est de là que venait le problème. Par contre, je ne comprend pas cette règle. Pourquoi définir qu'un select ne possède que des balises option?
Et merci pour le conseil W3C, c'est enregistré!

**SpaceFrog** · 20/05/2010, 11h12

le html est un langage structuré ...
pourquoi definir qu'une page html doit avoir un head et un body ...
un select est ainsi fait ...

balise div non visible par getElementById

JavaScript

Discussions similaires

Partager

Partager