Cannot set properties of null (setting 'classList')

Résolu

La poste

firpic Messages postés 90 Date d'inscription jeudi 3 juin 2021 Statut Membre Dernière intervention 20 décembre 2022 - Modifié le 29 janv. 2022 à 11:11
firpic Messages postés 90 Date d'inscription jeudi 3 juin 2021 Statut Membre Dernière intervention 20 décembre 2022 - 29 janv. 2022 à 12:10

Bonjour,

Depuis quelque jour j'ai un probleme javascript qui est apparue alors que quelque jour avant il n'y avait pas cette erreur.
Je ne comprend pas d'ou elle vient. J'ai essaye avec plusieur navigateur Chrome, Firefox, Edge.

voici l'erreur :


Uncaught TypeError: Cannot set properties of null (setting 'classList')
    at quit_div (script.js:65:26)
    at search_div (script.js:56:5)
    at HTMLAnchorElement.onclick (VM915 :24:69)

voici le code javascript :

let div_search = document.querySelector('.search-user');
let div_msg = document.querySelector('.message-user');
function search_div(){
    quit_div();
    div_search.classList='search-user';
}
function msg_div(){
    quit_div();
    div_msg.classList='message-user';
}

function quit_div(){
    div_search.classList = 'search-user none';
    div_msg.classList = 'message-user none';
}

et le code html:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
</head>
<body>
<div class="message-user none">
    <ion-icon name="close-outline" onclick="document.querySelector('.message-user').classList='message-user none';" class="quit"></ion-icon>
    <div class="list-user-msg">
        <div class="search-bar-div">
            <input type="search" class="search-bar-msg" onkeyup=""><!-- https://www.w3schools.com/php/php_ajax_php.asp -->
            <ion-icon name="search-outline" class="search-btn-msg"></ion-icon>
        </div>
        <div class="msg-list">
               <div class="msg-case">
                <a href="#?username=" class="click-case-msg">
                    <img src="https://upload.wikimedia.org/wikipedia/commons/thumb/a/a0/Firefox_logo%2C_2019.svg/640px-Firefox_logo%2C_2019.svg.png">
                    <h1>Fire Fox</h1>
                    <ion-icon name="send-outline" class="send-outline"></ion-icon>
                </a>
                </div>
        </div>
    </div>
    <div class="msg-box">
        <div class="box-msg-sending">
            <input type="text">
            <button><ion-icon name="paper-plane-outline"></ion-icon></button>
        </div class="msg-send-box">
            <div class="msg-send-to">
                <input type="text" value="FireFox" disabled>
                <p>by firefox</p>
            </div>
            <div class="msg-send-my">
                <input type="text" value="Chrome" disabled>
                <p>by chrome</p>
            </div>
        </div>
    </div>
</div>
<div class="search-user none">
    <div class="search-bar-div">
        <input type="search" class="search-bar" autocomplete="off" id="search-bar" disabled> 
        <ion-icon name="search-outline" class="search-btn"></ion-icon>
    </div>
    <div class="list-search-user div-user">
            <div class="user-case">
            <a href="#" class="click-case">
                <img src="https://upload.wikimedia.org/wikipedia/commons/thumb/a/a0/Firefox_logo%2C_2019.svg/640px-Firefox_logo%2C_2019.svg.png">
                <h1>Fire Fox</h1>
               <ion-icon name="send-outline" class="send-outline"></ion-icon>
            </a>
        </div>
    </div>
    <div class="info-user-case div-user none" id="info-user-case">

    </div>
    <ion-icon name="close-outline" onclick="document.querySelector('.search-user').classList='search-user none';" class="quit"></ion-icon>
</div>
</body>
</html>

A voir également:

Cannot read property of null traduction
Cannot read properties of undefined traduction - Meilleures réponses
Cannot read properties of undefined (reading 'scrollintoview') en francais - Meilleures réponses
Traduction créole guadeloupe français reverso - Forum traduction
Input signal out of range ✓ - Forum Matériel & Système
Google traduction photo - Guide
Waldik traduction ✓ - Forum Loisirs / Divertissements
Kif'n'dir traduction ✓ - Forum Windows

1 réponse

Réponse 1 / 1

jordane45 Messages postés 38484 Date d'inscription mercredi 22 octobre 2003 Statut Modérateur Dernière intervention 15 juillet 2025 4 751
29 janv. 2022 à 11:50

Bonjour,

Pour commencer.. le mot clé "let" servant à déclarer une variable .. a une portée restreinte de celle ci dans le code...
A la place.. utilises le mot clé "var", ou, pour ton besoin actuel, les déclarer en tant que constante via le mot clé "const"

Et bien entendu, pour que ça fonctionne.. il faut que ton JS soit bien chargé APRES le contenu HTML de ta page.

firpic Messages postés 90 Date d'inscription jeudi 3 juin 2021 Statut Membre Dernière intervention 20 décembre 2022 1
29 janv. 2022 à 12:10

Merci, je viens de comprendre je le declare au debut du code

Discussions similaires

Uncaught TypeError: Cannot read property 'top' of undefined

Bonjour,
J'utilise le code suivant qui me permet d'ajouter une class à un élément du menu lorsque celui-ci est au niveau de l'écran de l'internaute :
$(document).ready(function () { $(document).on("scroll", onScroll); }); function onScroll(event){ var scrollPos = $(document).scrollTop(); $('#nav-main a').each(function () { var currLink = $(this); var refElement = $(currLink.attr("href")); if (refElement.position().top scrollPos +55) { $('#mnav-main ul li a').removeClass("active"); currLink.addClass("active"); } else{ currLink.removeClass("active"); } }); }

Il...

Numéro de suivi colissimo invalide

Bonjour,

J'ai passé une commande sur un site internet, mais le numéro de suivi colissimo ne fonctionne pas. Voici le message qui apparait "Aucun colis ne correspond à vos critères de recherche. Veuillez vérifier la saisie de votre n° de colis et qu'il a été envoyé il y a moins de 90 jours".
Au début je pensais qu'il s'agissait d'un simple problème de mise à jour sur le site colissimo, mais après plusieurs jours d'attente le numéro de suivi ne marche toujours pas. Quelqu'un saurait-il m'aider?

Merci

.properties

Bonjour, je voudrai que l'on m'explique comment lire un fichier .properties car j'en ai absolument besoin, s'il faut télécharger un logiciel je ne veux pas payer. Merci d'avance

Problème avec ants.gouv.fr pour télécharger fichier en pdf

Bonjour, changeant de carburant ( abandon de l'essence pour l'éthanol car c'est moins cher) je dois remplir un formulaire. Il m'est demandé de télécharger et j'ai ce message d'erreur quand je télécharge le fichier "pv d'agrément éthanol": commun.file_upload.Access Denied. Ci-jointe le capture d'écran.

En vous remerciant.

Message modifié par la modération
Il est vivement déconseillé de mettre des informations personnelles (email, téléphone etc etc...) sur un forum public.

access denied

Bonjour,

SVP aidez-moi pour résoudre mon problème de connexion lorsque j'essaie de se connecter à un site le navigateur me donne « Access denied( content_filter_denied)
Si vous avez un logiciel qui autorise la connexion autre que Ultrasurf ça sera un grand plaisir
Parce que j'a déjà essaye ce logiciel mais il ne marche pas
Pour information la session ouverte est limitée :'(

Cordialement.

Colis VOVA dédouanement complété

Bonjour, j’ai commandé une paire de chaussure sur vova et je voulais savoir si mon colis a été saisi par la douane ou pas. Ayant l’habitude de commander c’est la première fois je ne comprends pas mon suivi ni la plateforme anjun.
Pouvez-vous m’éclaircir?

Dédouanement complété, arrivé au centre de traitement, GB
2019-04-16 09:33
Arrivé à l’aéroport de destination de sort Facility, GB
2019-04-16 00:45
Installation de départ à l’aéroport INTERNATIONAL de HONG KONG, HongKong
2019-04-14 15:30
Arrivé à sort Facility HONG KONG INTERNATIONAL AIRPORT, HongKong
2019-04-14 03:05
Installation de départ à SHENZHEN, Shenzhen <...

Votre réponse

Discussions similaires