Bonjour, je suis actuellement en train de réaliser le deuxième cour sur le JS où est abordé le DOM.

J'ai réalisé les exercices autant que possible mais ai fini par regarder la correction car j'avais toujours le même message d'erreur.

Voici la correction du prof :

// Affiche si un élément possède une classe
function possede(id, classe) {
    var instrument = document.getElementById(id);
    if (instrument !== null) {
        console.log(instrument.classList.contains(classe));
    } else {
        console.log("Aucun élément ne possède l'identifiant " + id);
    }
}

infosLiens();

possede("saxophone", "bois"); // Doit afficher true
possede("saxophone", "cuivre"); // Doit afficher false
possede("trompette", "cuivre"); // Doit afficher true
possede("contrebasse", "cordes"); // Doit afficher false
possede("contrebasse", "cordes"); // Doit afficher une erreur

 Et voici mon code

function possede (instrument, famille){
    console.log(document.getElementById(instrument).classList.contains(famille));
    if(document.getElementById(instrument)===null){
            console.log("Aucun élément ne possède l'identifiant " + instrument);
    }
}

possede("saxophone", "bois"); // Doit afficher true
possede("saxophone", "cuivre"); // Doit afficher false
possede("trompette", "cuivre"); // Doit afficher true
possede("contrebasse", "cordes"); // Doit afficher une erreur

JE me retrouve avec cette erreur pour le if : TypeError: document.getElementById(...) is null

Effectivement l’élément n'existe pas dans le html et c'est ce que je veux faire.

Le prof a lui inséré cela dans une variable pour la comparer à non null et moi j'ai réalisé une comparaison directe avec null.

Où est mon erreur?

Il faut d'abord l’insérer dans une variable?

Il est impossible de faire une comparaison à null?

J'ai appliqué

document.getElementById(instrument)

 avec un console.log aux autres éléments, qui existent dans la page html et voilà un exemple de ce que je récupère.

<li id="saxophone" class="vent bois">

Ors il me faudrait uniquement la valeur de id et non tout l'élément li. Une fois de plus, est ce c'est faisable en une ligne où je me fais des délires de débutants?

Merci d'avance de vos réponses.

-
Edité par AlexandreGuerin4 15 août 2018 à 19:53:56

console.log(document.getElementById(instrument).classList.contains(famille));

Cette ligne récupère l'élément puis regarde si son classList contient une classe donnée. Puis, tu refais la même récupération par id et tu vérifies si l'élément a été trouvé ou s'il a retourné null. Donc, si l'élément n'existe pas, ton code explose sur la ligne que j'ai collée ici, puisque tu tentes de vérifier si un élément qui n'existe pas a une propriété classList qui contient quelque chose. propriété classList n'existe pas sur un élément null, c'est ce que dit le message d'erreur.