JavaScript для верстальщика. Урок 02. Начало работы
jQuery — библиотека JavaScrip. Девиз jQuery: write less, do more - пиши меньше, делай больше.
1.Скачиваем jQuery
Download --- Download the compressed, production jQuery 3.2.1 (скачать сжатую версию)
2. Создаём папку web (имя произвольное), в ней папку js, в неё копируем скачанную библиотеку jQuery и в ней же создаём файл custom.js
3. Открываем Brackets (или ваш редактор кода). В папке web создаём документ index.html
Создаём основу веб-страницы. В Brackets с установленным дополнением Emmet для этого достаточно напечатать восклицательный знак и нажать Tab.
Скрипты подключаем перед закрывающим </body>.
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<script src="js/jquery-3.2.1.min.js"></script>
<script src="js/custom.js"></script>
</body>
</html>
Важно! Свои скрипты всегда подключаем после jQuery
4. Чтобы начать работу в среде jQuery в начале созданного нами файла custom.js пишем код:
$(document).ready(function(){
// здесь код
});
// здесь код
});
Эта конструкция говорит следующее: "Нужно дождаться загрузки всего html-документа и только потом выполнять js-код".
Её можно записать короче:
$(function(){
// здесь код
});
// здесь код
});
Такой способ использует автор.
5. Убедимся, что код работает:
$(function(){
alert("Привет")
});
Появляется всплывающее окно с надписью "Привет".
Если переставить местами подключённые js-файлы и custom.js подключить до jQuery, код не работает.