ГлавнаяJQueryОсновыКак подключить библиотеку JQuery

Как подключить библиотеку JQuery

Категория: Основы / Опубликовано: 2017-08-21 / Просмотров: 129

Способы подключения библиотеки JQuery

JQuery является библиотекой JavaScript, которая позволяет осуществить взаимодействие между JavaScript и HTML. Благодаря JQuery можно получить доступ к любому элементу DOM и манипулировать им. Разработчики предоставляют несколько версий данной библиотеки:

  • для релиза (сжатая версия, в которой удалены все комментарии и пробелы — имеет меньший вес);
  • для разработки (не сжатая версия для разработчиков с сохранённой структурой и пробелами — имеет больший вес)

Подключить JQuery к сайту можно двумя способами, которые существенно отличаются друг от друга и имеют свои плюсы и минусы. Сначала рассмотрим самый простой способ, а затем перейдём к более сложному.

Подключение JQuery при помощи CDN

CDN (Content Delivery Network) — географически распределённая сетевая инфраструктура для доставки контента пользователям. CDN позволяет ускорить доставку контента до оконечного пользователя.

Плюсы CDN

  • повышает производительность вашего сайта тем, что библиотека загружается из интернета а не из локального хранилища.

Примечание: если пользователь посещал другой сйт, который тоже использует CDN, то перейдя на наш сайт библиотека JQuery загрузится из кэша браузера.

Минусы CDN

  • если сервер CDN по каким-то причинам не доступен, то библиотека JQuery не будет подключена к вашему сайту.

Примечание: очень минимальный процент что сервера инфраструктуры CDN бывают недоступны.

На странице jquery.com/download нам предлагают несколько серверов CDN (Google CDN, Microsoft CDN, CDNJS CDN и JsDelivr CDN) с которых мы можем загружать и подключать библиотеку. Мы будем использовать стандартный JQuery CDN. Для подключения JQuery выполните несколько простых действий:

1. Откройте страницу code.jquery.com в вашем браузере.

2. Выберите нужную версию и стиль библиотеки.

Подключение библиотеки JQuery при помощи инфраструктуры CDN.

3. Добавьте следующий код для подключения библиотеки в область <head></head> вашего сайта.

<script src="https://code.jquery.com/jquery-3.2.1.js" integrity="sha256-DZAnKJ/6XZ9si04Hgrsxu/8s717jcIzLy3oi35EouyE=" crossorigin="anonymous"></script>

Атрибуты integrity и crossorigin используются для проверки целостности файла. Это позволяет браузерам гарантировать что файлы размещённые на сторонних ресурсах не были подделаны.

Устанавливаем код для подключения библиотеки в область head вашего сайта.

4. Библиотека успешно подключена к вашему сайту.

Подключение локальной библиотеки JQuery

Локальная библиотека — библиотека которую вы загрузили с официального сайта, а затем подключили её из корневой директории вашего сайта.

Плюсы локальной библиотеки

  • Библиотека JQuery всегда будет доступна для посетителей вашего сайта, так как будет загружаться из корневой директории.

Минусы локальной библиотеки

  • Когда посетитель зайдёт на сайт, браузер автоматически загрузит библиотеку JQuery в кэш. Это же в свою очередь скажется на производительности сайта.

Чтобы подключить библиотеку данным способом выполните несколько шагов по следующей инструкции:

1. Откройте страницу  jquery.com/download в вашем браузере.

2. Найдите заголовок JQuery и выберите нужную версию.

Подключение библиотеки JQuery  стандартным способом.

3. Загруженный файл библиотеки поместите в корневую директорию вашего сайта.

4. Добавьте следующий код для подключения библиотеки в область <head></head> вашего сайта.

<script src="js/jquery-3.2.1.js" type="text/javascript"></script>

где js — директория, а jquery-3.2.1.js — имя файла библиотеки.

С уважением, Артём Санников

Сайт: ArtemSannikov.ru

Похожие записи по теме

Добавить комментарий

Ваш e-mail не будет опубликован. Обязательные поля помечены *