Как JQuery в HTML-документ


Опубликованно 19.11.2018 19:55

Как JQuery в HTML-документ

JQuery является крупнейшей библиотекой скриптов, с помощью которых сайт заполнить добавлять интерактивные элементы и интересные дизайнерские возможности. Это считается оптимизированным и более эффективным, чем использование "чистого" JavaScript. В этой статье обсудим, как JQuery на вашей странице. Где скачать JQuery

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

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

Выберите любой версии JQuery, которая вам нужна, нажмите на ссылку правой кнопкой мыши, затем нажмите кнопку "Сохранить страницу" — файл в формате JS.

После загрузки библиотеки JQuery для работы. Функции Библиотеки JQuery

Прежде чем JQuery, важно понять, какой файл будет использоваться. Тот факт, что эта библиотека в виде двух версий: сжатый и несжатый. Чем они отличаются?

Из сжатой версией все ненужные знаки табуляции и пробелов. Это делается, чтобы уменьшить вес документа, на вашу страницу будет ссылаться при работе с библиотекой. В названии этой версии присутствует .мин — это признак того, что вы точно сжатая версия.

В не сжатую версию JQuery-код расположен так, что дает возможность все необходимые правки, это полезно для отладки. Также на сайте можно, но использование этой версии может снизить производительность сайта.

Закройте библиотеку в HTML-документ

Существует несколько способов, подключить JQuery в HTML.

Наиболее простым является использование тега <script>, путем ссылки на внешние файлы JavaScript.

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

Далее зайдите в HTML-документ и пишет там код, JQuery на сайте.

Код будет выглядеть следующим образом:

<!DOCTYPE html> <html> <head> <script src="/js/jquery.min.js"></script> </head> <body> </body> </html>

Тег <script> с атрибутом src, который на нужный файл в <head>.находится

Обратите внимание: на этом примере мы связываем страницу сжатую версию JQuery-библиотека, которая находится в папке "js" в корень сайта. Всегда будьте осторожны прописывается путь к файлы плагина, в противном случае документ не может относиться к вам.

Таким образом, вы должны разместить код на всех страницах, где используется JQuery.

Второй способ — через Google JQuery подключить.

Это еще проще: зайти на Google Developers, в разделе библиотеки JQuery для оптимизации и скопируйте код:

<script src="//ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

Этот код относится к текущей версии библиотеки. Он может назначить, либо в тег <head> аналогично предыдущему варианту, либо внизу страницы перед закрывающим тегом </body>.

Этот способ подключения JQuery-это хорошо, что вы не будете загромождать свои страницы с ненужной информацией, но и прямо ссылается на библиотеку на одном ресурсе. Google-служб не очень надежны, поэтому не переживайте, что на вашем сайте что-то не работает. Подключить JQuery оптимальный вариант, если вам требуется отладка исходного кода библиотеки.

Google также ссылается на сжатую версию библиотеки. JQuery при работе с CMS Wordpress

Большое количество сайтов на движке Wordpress, это считается наиболее гибким и удобным для разработчика. Поэтому существует специальный инструмент подключения JQuery-сайт позволяет на этой CMS.

Откройте файл functions.php и введите следующий код:

function theme_scripts_method(){ wp_enqueue_script( 'jquery'); } add_action( 'wp_enqueue_scripts', 'theme_scripts_method' ); В заключение

Jquery-библиотека с разнообразными функциями, можно добавить для придания Web-странице интерактивности и интересные элементы дизайна. Вы, как новичок в создании сайтов, так и для опытных разработчиков.

Jquery не снижает производительность сайта и подключить очень легко. Автор: Ольга Чекмарева 21. Ноябрь, 2018



Категория: Hi-Tech