10644 sujets

JavaScript, DOM et API Web HTML5

Bonjour,

Je pratique PHP et j'ai récemment commencé l'apprentissage de javascript.
J'ai d'entrée un petit problème (j'ai déjà cherché par mes propres moyens et fait plusieurs tests mais je ne trouve pas de solution).

Avec cette ligne de code:
document.querySelector('.notifications').style.display = 'null'


Lorsque je la rentre directement dans ma console, il n'y a aucun problème et l'élément se met bien en display null.

Cependant dès que je met exactement cette même ligne de code dans mon html. (j'ai plus précisément un fichier js relié à mon html mais ça ne change rien) cette erreur apparaît :

index.js:1 Uncaught TypeError: Cannot read property 'style' of null


Comme si ma class css n’existait pas, pourtant ça marche bien depuis ma console et après vérification elle existe bien. Du coup je comprend pas je trouve pas ça très logique (même si la raison doit l'être)

cordialement,
mattéo
Modifié par mattzeub (03 May 2019 - 22:16)
petite précision: le problème ne vient pas de style.
C'est en effet mon document.querySelector('.notifications') qui renvoit undefinded.
Alors que dans la console ça me renvoi bien mon élément.

J'ai essayé de remplacer mon queryselector par un getElementsByClassName('notifications')[0]
pareil ça marche dans la console mais pas dans le fichier.

cordialement,
mattéo
Bonjour mattzeub,
Pour accéder à un élément du DOm, il faut que le DOM soit charger
je penses que ton pb vient de la.

document.addEventListener('DOMContentLoaded',function(){
  //traitement le dom est accessible
});
Meilleure solution
yes effectivement, j'ai fais l'erreur bête de charger mon fichier js dans mon head, ducoup aucun contenu html n'était chargé au moment de l'execution.
merci bcp Smiley smile