Почему JS в codepen работает, а на сервере или локалке нет?

Question

[xonar]

В codepen при нажатие на вход, всплывает форма авторизации, оверлей и всё удачно можно скрыть. То есть, js код отрабатывает отлично.

Пример - https://codepen.io/ruslan-lysenko/pen/rEgqBe

А вот на локалке или на реальном сервере не отрабатывает js код, а в консоли браузера пишет:

Uncaught TypeError: Cannot read property 'addEventListener' of null
at modal.js:5

Почему в codepen работает, а у меня с такими же данными на локалке или реальном сервер нет?
До этого создавал вопрос по этой проблеме, но думал, что проблема в VS code и его open live server, а оказалось, что не так.

Comments

[Владимир]

прост помести свои скрипты вниз или оберни в

window.onload = function() {
   // Ваш скрипт
};

[xonar]

Владимир, Проблема решена, но спасибо за этот хак)

Answer 1

[hzzzzl]

скрипт подключен после того как в html появляется этот '.login-link', или в < head > например?
выглядит что js выполняется до того, как рисуется дерево html, и элемент просто еще не существует


вот вставил скрипт перед закрывающим /body

Comments

[xonar]

Я ВАС ЛЮБЛЮ! ОБОЖАЮ ПРОСТО!
СУТКИ! СУТКИ Я СТРАДАЛ!

Я вчера только стал изучать JS и не знал, что это может влиять. ОГРОМНОЕ СПАСИБО! ЗАРАБОТАЛО! УРА))))

[hzzzzl]

xonar, очень нефигово сверстано для "вчера стал изучать" :О
но да, хтмл браузером читается тупо сверху вниз, и скрипты тоже выполняются по порядку появления (или подключения) на странице

[xonar]

hzzzzl, Не, верстать я стал давно) 2 недели) Этот макет по видео курсу верстал, там не весь мой код, на этом макете решил js проверить)))

Спасибо за объяснение, буду знать. А то думал, что браузер просто обрабатывает js после загрузки html и ему не важно где вставлен js)