javascript – Uncaught TypeError: Cannot set properties of null (setting ‘onclick’)? – Stack Overflow

Posted on by mtoplistChuyên mục:Top List

This question already has answers here:

Why does jQuery or a DOM method such as getElementById not find the element?

(6 answers)

Closed

10 months ago

.

I wrote a very simple html css program and add a javascript in it, here is my program and my javascript in it

(my program : https://github.com/phianh2904/phan-8-web-the-band-tablet-responsive)

my javacript in index.html file

    <script>
    var header = document.getElementById('header');
    var mobileMenu = document.getElementById('mobile-menu');

    mobileMenu.onclick = function() {
        console.log(header.clientHeight);
    }

    const buyBtns = document.querySelectorAll('.js-buy-ticket')
    const modal = document.querySelector('.js-modal')
    const modalclose = document.querySelector('.js-modal-close')
    const modalcontainer = document.querySelector('.js-modal-container')

    // ham hien thi modal mua ve tuc la them class open vao modal
    function showBuyTickets() {
        modal.classList.add('open')
    }

    // ham an modal mua ve them class open vao modal
    function hideBuyTickets() {
        modal.classList.remove('open')
    }


    // lap qua tung the button va nghe hanh vi click
    for (const buyBtn of buyBtns) {
        buyBtn.addEventListener('click', showBuyTickets)
    }

    // nghe hanh vi click vao button close
    modalclose.addEventListener('click', hideBuyTickets)

    //clcik vao khoang khong de dong cac the con lai
    modal.addEventListener('click', hideBuyTickets)

    //click vao ben trong thi khong bi lam sao ca
    modalcontainer.addEventListener('click', function(event) {
        event.stopPropagation()
    })
    </script>

As you can see in my javascript code snippet, it is very simple. I Wrote the code

var header = document.getElementById('header');
var mobileMenu = document.getElementById('mobile-menu');
mobileMenu.onclick = function() {
      console.log(header.clientHeight);
}

to show the clientHeight.

But here is the error I had :

picture about my problem

Uncaught TypeError: Cannot set properties of null (setting ‘onclick’)
at index.html:231:28

As they said in this link Uncaught TypeError: Cannot set property ‘onclick’ of null

I put the script in the end of the body element, and wrap code in but it did not work.
So could you please give me some answer for this problem ? Thank you very much for your time.

mtoplist