Как да свържете jquery към HTML документ

JQuery е най-изчерпателната и популярна библиотека за скриптове, за да се увеличи максимално функционалността на уеб страниците. Използването му в много случаи се счита за по-предпочитано от писането на индивидуални скриптове за сайта, тъй като тази библиотека отличава надеждността и способността за работа във всички браузъри, включително тези в по-старите им версии. Също така, използването на JQuery оптимизира работата на сайта и създава много по-малко натоварване от "чистия" код на javascript. В тази статия ще разгледаме как да свържете jQuery към вашия сайт.

Как да изтеглите JQuery

За да свържете JQuery уеб страница към библиотека, тя трябва да бъде изтеглена и добавена в папката на javascript файловете в директорията, където се намират файловете на уеб страниците. Библиотеката може да бъде изтеглена на официалния сайт, последната версия на jQuery и връзката за изтегляне ще бъдат изброени директно на главната страница. Изглежда така:
Следователно можем да видим, че най-новата версия на библиотеката на Jquery за днес (октомври 2018 г.) е v331. Препоръчително е да следвате актуализациите и редовно да свързвате текущата версия, за да избегнете грешки при показването на информация на сайта.


След като файлът бъде изтеглен, той трябва да бъде поставен в указателя на хоста, който съдържа другите файлове на сайта. Ако уеб страницата вече не е включена в мрежата, но се намира на компютъра, изтегленият файл просто се поставя в съответната папка. Ако вече е пренесен на сървъра, трябва да използвате всеки мениджър на файлове за мигриранеданни (например WinSCP или FileZilla). За да съхраните JS-скриптове е по-добре да изберете отделна папка. Тя също има jQuery.

Свързване на изтеглена библиотека

Как да свържете библиотека jQuery към HTML документ. Първо, отворете във всеки текстов редактор или HTML кодова страница на сайта си. В случай, че работите по CMS, трябва да отидете в секцията, където се променя главното устройство.


Следната област се въвежда със следния код с връзка, указваща как да се свържат JQuery скриптове и води до съответната директория. Това ще изглежда така:

& lt; script src = "scripts /jquery-3.3.1.min.js" & gt;

Съответно, скриптовете са папка, в която се намира желаната библиотека, последвана от пълното й име с резолюция (подобно на свързването на всички други файлове с документа). Както виждате, се използва маркерът & lt; script & gt ;. с атрибута src указва пътя до файла.

Този метод за свързване на jQuery е най-често срещаният, но в някои случаи може леко да намали производителността на сайта.

Свързване на jQuery към Wordpress

Wordpress е една от най-популярните CMS за разработване на уебсайтове и блогове. Нека разгледаме как да свържем jQuery към WordPress.

Няма да бъде грешка да се свърже библиотеката с помощта на описания по-горе метод чрез заглавния блок, но за оптимизиране на сайта препоръчваме следния метод.

Изтеглянето на библиотеката в този случай не е задължително. Трябва да отидете в режим на редактиране на файла functions.php и да напишете в него следния код:

функция my_enqueue_scripts () {
wp_enqueue_script ('jquery');
}
add_action ('wp_enqueue_scripts', 'my_enqueue_scripts');

По този начин връзката ще бъде изпълнена.

Използване на JQuery с Google

Съществува удобен начин за използване на услугите на Google за свързване на JQuery към сайта. Неговите предимства включват увеличаване на скоростта на сайта, тъй като файловете не са свързани с вътрешната система за документи, а външният ресурс, т.е., допълнителното време за изтегляне не се изразходва, а страницата работи по-бързо.


& lt; script type = "text /javascript" & gt;
може да blockSettings2 = {blockId: "R-A-271049-5", renderTo: "yandex_rtb_R-A-70350-39", async: 0};
if (document.cookie.indexOf ("abmatch =")> = 0) blockSettings2.statId = 70350;
Функция (a, b, c, d, e) {a [c] = a [c] || [], a [c] .push (функция () {Ya.Context.AdvManager.render (blockSettings2)}), e = b.getElementsByTagName ("скрипт") , d = b.createElement ("скрипт"), d.type = "text /javascript", d.src = "//an.yandex .ru /system /context.js ", d.async =! 0e.parentNode.insertBefore (d, e)} (това, този.документ," yandexContextAsyncCallbacks ");

Как да свържете JQuery към сайта с Google.

Необходимо е, както при първия метод, да влезете в блока на всички HTML-документи, след това да добавите следния код там:

& lt; script src = " ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js">

Това е директна връзка към библиотеката, публикувана директно в Google. В бъдеще, когато скриптът ще има достъп до библиотеката, той веднага ще се изтегли. Важно е да се отбележи, че най-новата версия на jQuery трябва да бъде посочена в връзката. Кодът на най-новата версия може да бъде взет от услугата на Google Developers чрез търсене в името на библиотеката.

JQuery Options

Запитан как да се свърже JQuery със сайта, вероятно сте обърнали внимание на факта, че при изтеглянето стават достъпни два файла, единият от които има допълнителен "min" в името, а вторият не е. И дветеОпцията може да се използва за свързване към уеб страницата, но има разлика между тях. Мин версията в заглавието се компресира, тъй като всички допълнителни знаци, като табулации и преходи на низове, са премахнати от нея. На практика е невъзможно да се използва за извършване на промени и отстраняване на грешки, но показва добра производителност при свързване към сайта. Некомпресираната версия, напротив, се използва добре за отстраняване на грешки в кода, но е по-важно и не се препоръчва да се използва за свързване към сайта.
​​

Заключение

И така, прегледахме основните техники и се научихме да свързваме jQuery скриптове с HTML документ. В зависимост от поставените цели и задачи, както и от личното удобство, можете да използвате всяка от предлаганите опции. Библиотеката JQuery е чудесен начин да разширите функционалността на сайта, без да губите производителност.

Свързани публикации