[debutant] document.getElementById("id") has no properties ?

**ThitoO** · 05/04/2008, 18h18

Bonjour à tous,
Je suis tout nouveau dans l'univers javascript et j'aimerai avoir vos lumieres à propos d'un bug que je ne comprend pas

Voici mon code JS:

Code :

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

document.getElementById("id").innerHTML="aaa";

et mon Code html:

Code :

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

<span id="id">rrr</span>

Quand je teste dans firefox, rien ne se passe, et dans la console Firebug j'ai droit à un joli

document.getElementById("id") has no properties
[Break on this error] document.getElementById("id").innerHTML="aaa";

Est-ce que quelqu'un a une idée ?
Parce que j'applique exactement ce que j'ai lu dans un cours ...

**SpaceFrog** · 05/04/2008, 18h32

a quel moment la ligne est elle interprétée ???

Il faut que l'objet soit instancié (existe)

prenons un exemple:

Code :

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

1
2
3
4
5
6
7
8
9
10
11
 
<html>
<head>
<title>Nouvelle page 1</title>
</head>
<body>
<script type='text/javascript'>
alert(document.getElementById('id').id);
</script>
<div id='id'></div>
</body>

au moment de l'interprétation du le ligne le div n'existe pas encore ...

En mettant la ligne de script après cela fonctionne

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
 
<html>
<head>
<title>Nouvelle page 1</title>
</head>
<body>
<div id='id'></div>
<script type='text/javascript'>
alert(document.getElementById('id').id);
</script>
 
</body>

</html>

Il faut donc attendre que l'objet soit instancié ...
Alors me diras tu il faut mettre les scripts en fin de page ?
Non il faut bien les mettre dans le head, mais ne les declancher qu'une fois tous les objets de la page instanciés ...avec l'évènement onload du body ou window.onlaod

Code :

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

1
2
3
4
5
6
7
8
9
10
11
12
13
14
 
<html>
<head>
<script type='text/javascript'>
function foo(){
alert(document.getElementById('id').id);
}
</script>
<title>Nouvelle page 1</title>
</head>
<body onload="foo()">
<div id='id'></div>
</body>
</html>

Accessoirement il vaut mieux éviter de nommer une variable id ou tout autre mot "reservé" cela ne peut qu'entrainer confusion dasn le code et parfois créer des conflits ...

**ThitoO** · 05/04/2008, 18h42

Effectivement tu as raison SpaceFrog ... le script que j'ai dans mon bookin se trouve dans une fonction, qui se declenche quand on click sur un bouton

donc quand la page est "terminée".

Pour ce qui est du nom de la variable, c'etait juste un test, pour etre sur de pas faire de fautes de frappe dans mon code JS

Merci beaucoup

(ps: SpaceFrog tu habite ici on dirait, c'etait déjà toi qui m'a aidait quand je commencait le html il y a plus de 3 ans

)
Merci pour tes bon conseils