[Résolu] [Javascript] erreur : document.getElementById(...) is null

Bonsoir,


Contexte :
Voilà je suis en train de réaliser un puissance 4 ( l'exercice classique des débutants ! ) et je rencontre régulièrement cette erreur qui parfois n'empêche pas mes scripts de s'exécuter mais qui bloque certaines fonctionnalités.


Message d'erreur :

TypeError: document.getElementById(...) is null

C'est une erreur classique, mais honnêtement j'ai bien cherché et je n'ai pas trouvé de situations qui soient vraiment similaires à la mienne sur le net ou sur ce forum, donc pas de solution non plus


Voici un aperçu de mon code.

Côté HTML
J'ai choisi de créer mon tableau (7 colonnes et 6 lignes) en html sans le générer dynamiquement, donc grosso modo ça ressemble à ça.

<table>
	<tr>
		<td id="c00"><img src="images/img0.png"></td>
		<td id="c10"><img src="images/img0.png"></td>
		<td id="c20"><img src="images/img0.png"></td>
		<td id="c30"><img src="images/img0.png"></td>
		<!-- et ainsi de suite...-->
	</tr>
</table>

Côté JS
Je fais jouer mon joueur ou mon ia, puis j'affiche le résultat :

for (i=0;i<=7;i++)
{
for (j=0;j<=6;j++)
{document.getElementById('c'+i+j).innerHTML='<img src="images/img'+joueur+'.png">';}
}

Et là j'ai un message d'erreur.

J'ai bien sûr déclaré ma variable joueur et j'aimerais bien lui déclarer aussi mon id, sauf que vue la façon dont j'ai construit mon code, je ne sais pas du tout comment lui renseigner .

De même lorsque je veux rejouer, je réinitialise mon tableau : valeurs à 0 côté code, et côté graphique je remplis de nouveau mon tableau avec mes "img0.png".

for (i=0;i<=7;i++)
{
for (j=0;j<=6;j++)
{document.getElementById('c'+i+j).innerHTML='<img src="images/img0.png">';}
}

Et rebelote => erreur.

Si vous avez des idées ?
Je n'ai pas forcément envie de tout recommencer, étant donné que bizarrement des fois ça marche.
Modifié par Hegaan (09 Feb 2013 - 20:33)

C'est à ce moment là qu'il faut prendre le temps de déboguer son code dans une console.

var id = 'c' + i + j;
console.log( id );
document.getElementById( id ) /* etc */

Regarde ce que ton code génère comme id et tu comprendras probablement d'où vient ton problème.

Merci pour ta réponse, bizarrement en reprenant mon script ce matin je n'avais plus d'erreur, il avait dû garder un truc en cache.

Je débute et si je me sers des 'alert' et de la console en "mode simple", j'ignorais l'existence de la fonction dont tu parles et c'est vrai qu'elle est pas mal du tout, donc je prends note pour la fois prochaine

(et puis du coup je suis allée faire un tour sur le site d'alsa pour voir tout ce qu'il est possible d'essayer pour déboguer son code avant de crier à l'aide )

Bref sujet résolu !