22 ноября в 19:00 состоится вебинар
"Как открыть для себя новые возможности через современную профессию Frontend разработчика"
Детальнее по ссылке.

13 Дек 2015

Узнайте как подключить библиотеку jQuery

Все опытные и даже некоторые начинающие программисты знают о существование специальных библиотек, которые упрощают работу с кодом. Одна из таких библиотек, часто используемых программистами, является jQuery.

Как можно коротко описать эту вспомогательную JavaScript-библиотеку?

Как вы уже поняли со слов JavaScript-библиотека, jQuery взаимодействует с JavaScript, а также с HTML. Главный плюс этой библиотеки в том, что с ее помощью можно получить доступ к любому элементу DOM-структуры с удивительной легкостью. А также, jQuery предоставляет удобный API для работы с AJAX (c AJAX мы познакомимся в будущем). В общем, можно найти множество плюсов и «тайных дверей» в этой библиотеке, но сейчас у нас с вами стоит задача о подключение jQuery. Чем мы с вами сейчас и займемся.

Подключение jQuery

Подключить библиотеку можно двумя способами. Рассмотрим первый из них.

 

JQuery_DownloadЗаходим на сайт http://jquery.com/. После выбираем вкладку Download. В открывшемся окне нам нужно скачать подходящую нам версию jQuery. Там вы можете увидеть jQuery 1.x и jQuery 2.x.  Чем же они отличаются? Да практически ничем, а только тем, что  jQuery 2.x не поддерживается нашим «любимым» IE (версии 6, 7, 8). Так что, выбираем jQuery 1.x. Там тоже есть некое разветвление. Нашему вниманию предлагают сжатую и не сжатую версию библиотеки (Download the compressed, production jQuery 1.11.3, Download the uncompressed, development jQuery 1.11.3). Обе версии абсолютно одинаковы, за исключением экономии места. Вы можете скачать обе и увидеть, что в не сжатой версии есть комментарии, в то время как сжатая предстает перед нами даже без пробелов.

После скачивания самой библиотеки нам надо подключить ее к нашему потенциальному HTML-документу. Делается это следующим образом:

<! DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<script src="Указываем наш путь к библиотеке"></script>
...
</head>
<body>
...
</body>
</html>

Вот и подключена наша библиотека. Первый способ мы рассмотрели.

 

Второй намного проще и удобнее.

Так как Google является самой крупной компанией на рынке браузерных технологий, он приготовил фишечку и для любителей jQuery. Просто в место указанного нами пути  скаченной библиотека вставляем вот эту волшебную ссылку http://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js. Если вы ее откроете, то увидите сжатый код библиотеки jQuery. Также, вы можете наблюдать там AJAX-технологии, которые в будущем вам не придется подключать отдельно.

<! DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>
...
</head>
<body>
...
</body>
</html>

В общем-то и все. Можем приступать к работе с jQuery и осваивать новые горизонты с помощью этого могущественного механизма.