jQuery – это библиотека написанная на JavaScript специально для быстрого и простого взаимодействия с HTML и CSS. Благодаря jQuery можно легко получать доступ к любому элементу, атрибуту и всячески использовать их.

Чтобы работать с jQuery, нужно скачать библиотеку с официального сайта разработчика. После чего разместить в какой-то папке и подключать при помощи тега <script> в HTML документе. Можно не скачивать библиотеку jQuery, а указать абсолютный путь до библиотеки. Смотрим пример 1 и 2.

<!-- эта библиотека лежит на сайте codebra -->
<!-- можно ее подключать в практике -->
<script src = "/js/lib/jquery.min.js"></script>

Пример 2

<!-- эта библиотека лежит на сайте официальном сайте -->
<script src = "//code.jquery.com/jquery-1.11.3.min.js"></script>

Далее рассмотрим третий пример и разберем его по кускам.

$('h1').hide();

Как видите, код простой. Очень простое объяснение работы этого скрипта: интерпретатор находит знак доллара ($) и понимает, что это jQuery, далее проверяет, что находится в скобках после доллара, видит, что мы хотим работать с элементом h1, далее находит функцию (действие) hide() и выполняет ее для этого элемента. О hide() поговорим подробно позже. Функция hide() нужна нам, чтобы скрыть элемент. Что произойдет? Элемент h1 будет скрыт.

Еще пару примеров. Четвертый иллюстрирует работу с псевдоклассами. В пятом будет показано, как просто при помощи jQuery работать с классами, в шестом — с идентификаторами (id).

$('h1:first-of-type').hide();

Пример 5

$('.box .item').hide();

Пример 6

$('#header').hide();

В седьмом примере показан общий вид синтаксиса jQuery.

$("элемент").функция("атрибуты функции");

Похожие записи:

Урок 2. Подключаем Bootstrap Урок 2. Селекторы в jQuery Урок 3. Фильтры в jQuery Урок 3. Генерация SSH-ключа для работы с GitHub Первое знакомство с PHP Урок 5. Небольшая практика по Bootstrap Урок 2. Подготовка проекта к работе с Git Урок 1. Знакомство с Git Урок 3. Создаем столбцы в Bootstrap Урок 4. Адаптивные столбцы в Bootstrap