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

195
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 дерева к этому моменту уже подгружены, поэтому скрипт работает без проблем.

READ ALSO
Смена картинки при клике

Смена картинки при клике

Как написать на Jquery функцию, которая будет при нажатии на иконку плюс (изображение plusgif) будет менять его на минус (изображение minus

243
SVG shadow не появляется

SVG shadow не появляется

SVG, с которым я работаю, имеет тень, сделанную с помощью фильтра feGaussianBlur

167
Картинка по ширине текста

Картинка по ширине текста

Доброго времени суток, встала следующая задача:

174