Для тех, кто создает сайты или хочет научиться их создавать придется столкнуться с таким словом, как библиотека jQuery. Давайте выясним, что такое jQuery.
jQuery – это огромнейшая библиотека скриптов на JavaScript, которая находится в одном файле. С помощью jQuery веб-мастер может сделать красивый и функциональный сайт. В основном библиотеку jQuery используют на сайте в качестве украшения.
Что такое библиотека jQuery, я уже рассказал. Осталось рассказать, как ее подключить к сайту (HTML) и показать, где ее можно использовать.
Итак, как подключить библиотеку jQuery к сайту? Существуют два варианта подключения: подключение к файлу напрямую (через официальный сайт) или скачать файл к себе на сервер. Сейчас эти два способа и рассмотрим.
Как подключить библиотеку jQuery к сайту (HTML)
Способ 1 - подключение к файлу напрямую (через официальный сайт)
Заходи́те на официальный сайт jquery.com. Нажмите на ссылку «Download jQuery», которая находится с правой стороны:
Откроется новая страница. Нажмите правой кнопкой мышки по ссылке «Download the compressed, production jQuery» и выберите вкладку «Копировать адрес ссылки».
Теперь добавьте перед закрывающим тегом </head> вот эту строчку:
<script ENGINE="text/javascript" src="http://code.jquery.com/jquery-1.11.2.js "></script>
где http://code.jquery.com/jquery-1.11.2.js – скопированный адрес
Готовый код:
<html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <title>Как подключить библиотека jQuery к сайту (HTML)</title> <script type="text/javascript" src=" http://code.jquery.com/jquery-1.11.2.js "></script </head> <body> </body> </html>
Способ 2 - скачать файл к себе на сервер
Переходи́те на официальный сайт jquery.com и скачивайте последнюю версию jQuery.
Когда перейдете на официальный сайт, нажмите на ссылку «Download jQuery», которая находится с правой стороны:
Нахо́дите и перехо́дите по ссылке «Download the compressed, production jQuery»:
Указывайте место, куда скачивать файл. Если по какой-то причине, откроется в браузере набор каких-то кодов, не пугайтесь. Нажмите в браузере «Файл» => «Сохранить как…» и указываете место, куда сохранить файл.
Теперь на сервере, где лежит ваш сайт, создайте папку «js» (если ее нет) и закиньте туда скачанный файл. Для примера я скачал файл версии 1.11.2 под названием «jquery-1.11.2.min.js». Теперь сделаем к нему подключение на сайте.
Добавьте перед закрывающим тегом </head> вот эту строчку:
<script type="text/javascript" src="js/jquery-1.11.2.js"></script>
Готовый код:
<html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="content-type" content="text/html; charset=utf-8" /> <title>Как подключить библиотека jQuery к сайту (HTML)</title> <script type="text/javascript" src="js/jquery-1.11.2.js"></script> </head> <body> </body> </html>
Как проверить, правильно ли подключен файл jQuery?
Добавьте между тегами <head></head> вот этот код:
<script type="text/javascript"> $(document).ready(function(){ $('body').append('<br/>Этот текст добавлен с помощью jQuery'); }); </script>
Если библиотека подключена правильно, вы увидите текст «Этот текст добавлен с помощью jQuery». Если неправильно, тогда этого текста не будет.
Или можете добавить между тегами <head></head> вот этот код:
<script type="text/javascript"> if (window.jQuery) alert("jQuery подключен"); else alert("jQuery не подключен"); </script> <script type="text/javascript"> $(document).ready(function(){ alert(jQuery.fn.jquery); }); </script>
Если библиотека подключена правильно, вы увидите текст «jQuery подключен». Если библиотека подключена неправильно, тогда вы увидите текст «jQuery не подключен».
Где я использую библиотеку jQuery ?
При создании спойлера.
При создании резинового фона.
Понравился пост? Помоги другим узнать об этой статье, кликни на кнопку социальных сетей ↓↓↓
Последние новости категории:
Похожие статьи
Популярные статьи:
-
Как узнать id компьютера
Дата: 29 марта 2013
Прокомментировано:90
просмотров: 330341 -
Размеры форматов листов А0 – А7
Дата: 23 января 2013
Прокомментировано:3
просмотров: 274700 -
Смешные логические загадки с подвохом, отгадки прилагаются
Дата: 12 ноября 2014
Прокомментировано:5
просмотров: 222518 -
Готовые макеты блоков для веб-страниц на HTML и CSS
Дата: 25 июня 2014
Прокомментировано:23
просмотров: 187688 -
Установка windows 7 на ноутбук
Дата: 18 декабря 2012
Прокомментировано:169
просмотров: 186564
6 Ответов на комментарий - Как подключить библиотеку jQuery в HTML
Добавить комментарий
Метки: javascript, Вебмастеру, для начинающих
Спасибо автору! Очень полезная информация и нужная.
Не ясна одна деталь.. Степа обьясните пожалуйста, некогда я уже вставлял в код “движка” сайта, а именно в основной файл
index.template.php только 1 небольшой скрипт на библиотеке jQuery. Он работает, проблем нет. Но в инете попалась информация что вторично использовать скрипты на jQuery уже нельзя. Так ли это? Проясните пожалуйста ситуацию. Насколько скрипты на jQuery
нагружают сайт и вызывают увеличение процессорной нагрузки сервера?
(хостинг у меня платный со всеми “наворотами” )
Спасибо. С Уважением
Здравствуте Степа! Пока коммент не одобрен, допишу..
вообщем по поводу jQuery . Погуглил и похарабрил.. кое что узнал новое. Вопрос выше неверно сформулировал, если правильно уяснил библиотеку jQuery можно подключить 1 раз и навсегда. Затем по мере разумности выбирать разнообразные скрипты основанные на этой библиотеке и подключать. Какая jQuery на сегодняшний день актуальна или № версии?
Или нет верно? Спасибо. С Уважением
(сайт на “движке” smf)
Здравствуйте! Подключать один раз на одной странице. Т.е., если заголовки у страниц разные (заголовки страниц формируются по разным правилам), то подключать придется не один раз.Выбирать можно не готовые скрипты, а готовые команды. По сути, jQuery – это JavaScript фреймворк, библиотека кроссбраузерных реализаций той или иной функции. Т.е., если Вам нужно обратится к элементам по имени класса, или видоизменить курсор, то реализация этого на JS в geсko браузерах и старых версиях ИЕ, разная (на много строчек), в jQ все решится одной командой в одну строку для всех браузеров. (Ну, так должно быть в идеале.) Так же в jQ в одну строку выполняются многие ф-ции, для написания которых на JS потребуется много времени. Обо всех возможностях можно найти в документации к jQ)
Актуальность версии jQ – не совсем правильный вопрос. Они актуальны все, дело в том, есть ли в той или иной версии то, что Вам нужно. В новых функционал больше, но в них, как правило, отказываются от поддержки очень уж старых браузеров. Плюс ко всему, небольшие различия в реализации того или иного функционала в разных версиях приведет к конфликту этих версий, поэтому подключать более одной версии библиотеки крайне нежелательно. Опять же, что в какой поддерживается, и какие есть возможности, описано в документации.
Уяснил, доходчиво и ясно, спасибо.
С Уважением..
Удачи Вам !
Скачал и подключил :
,вставил проверочный код – библиотека не подключена. Может – потому-что на флэшке ? (нет доступа к FTP-серверу)
разместите файл “jquery-1.11.3.min.js” и “html” – файл в одну папку.
Подключите так: