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

Version imprimable

05/04/2008, 18h18
ThitoO

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

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:

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

et mon Code html:

Code:

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

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

Citation:

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 ...

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

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

prenons un exemple:
Code:

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:

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:

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 ...

05/04/2008, 18h42
ThitoO

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 :mouarf:)
Merci pour tes bon conseils :D
05/04/2008, 18h51
SpaceFrog

:lol:
Je fais partie des murs maintenant :D

;)