Разница в объявлении JS файла

234

13 декабря 2017, 21:52

Доброго времени суток !
Почему если объявить JS файл в начале кода html, некоторые функции не работают, а если в конце кода, то работают ?
Никогда с таким не сталкивался, а заметил только сейчас.

Вот пример подключения JS файла в начале кода:

<head>
    <title>Тайтл</title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
    <script type="text/javascript" src="./js/main.js"></script>
</head>
<body>
/*
    Тут код
*/
</body>

Вот пример подключения JS файла в конце кода перед тегом </body>:

<head>
    <title>Тайтл</title>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
</head>
<body>
/*
    Тут код
*/
<script type="text/javascript" src="./js/main.js"></script>
</body>

Answer 1

Было бы хорошо, конечно, если бы вы пример подключения показали.

Почему если объявить js файл в начале кода html

Я так понимаю, вы подключаете его вначале тега <body> или в <head>? Скрипты грузятся синхронно. Если вы подключаете скрипт вначале html'а и обращаетесь к какому-то элементу, то, очевидно, такой скрипт работать не будет, так как элемента то такого ещё нет.

Когда вы подключаете скрипт в конце документа, все элементы DOM дерева к этому моменту уже подгружены, поэтому скрипт работает без проблем.