Kako povezati jquery z dokumentom HTML

JQuery je najobsežnejša in najbolj priljubljena knjižnica skript, da bi povečali funkcionalnost spletnih strani. Njegova uporaba je v mnogih primerih bolj zaželena kot pisanje posameznih scenarijev za spletno mesto, saj ta knjižnica razlikuje zanesljivost in sposobnost dela v vseh brskalnikih, vključno s tistimi v starejših različicah. Tudi z uporabo JQuery optimizira delo spletnega mesta in ustvarja veliko manj obremenitve kot "čista" koda na javascript. V tem članku bomo razložili, kako povezati jQuery z vašim spletnim mestom.

Kako prenesti JQuery

Če želite povezati JQuery spletno stran s knjižnico, jo morate prenesti in dodati v mapo javascript datotek v imeniku, kjer se nahajajo datoteke spletne strani. Knjižnico lahko prenesete na uradno spletno stran, najnovejšo različico jQuery in povezavo za prenos pa najdete neposredno na glavni strani. Izgleda takole:
Zato lahko vidimo, da je zadnja različica knjižnice Jquery za danes (oktober 2018) v331. Priporočljivo je, da sledite nadgradnjam in redno povežete trenutno različico, da se izognete napakam pri prikazovanju informacij na spletnem mestu.


Ko je datoteka prenesena, jo je treba namestiti v imenik na gostovanju, ki vsebuje druge datoteke spletnega mesta. Če spletna stran ni že navedena v omrežju, vendar se nahaja na računalniku, je prenesena datoteka preprosto shranjena v ustrezno mapo. Če je že bila preseljena na strežnik, morate za selitev uporabiti kateri koli upravljalnik datotekpodatkov (na primer WinSCP ali FileZilla). Za shranjevanje JS-skriptov je bolje izbrati ločeno mapo. Ima tudi jQuery.

Povezovanje prenesene knjižnice

Kako povezati knjižnico jQuery z dokumentom HTML. Najprej odprite v katerem koli urejevalniku besedila ali kodni strani HTML svojega mesta. Če delate na CMS-ju, morate iti na razdelek, kjer se glavna enota spremeni.


Naslednje področje je predstavljeno z naslednjo kodo s povezavo, ki kaže, kako povezati skripte JQuery in vodi do ustreznega imenika. To bo izgledalo takole:

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

Skladno s tem je skripta mapa, v kateri se nahaja želena knjižnica, ki ji sledi polno ime z ločljivostjo (podobno povezavi drugih datotek z dokumentom). Kot lahko vidite, se uporablja oznaka & lt; script & gt ;. z atributom src podaja pot do datoteke.

Ta metoda povezave jQuery je najpogostejša, v nekaterih primerih pa lahko nekoliko zmanjša zmogljivost spletnega mesta.

Povezovanje jQuery z Wordpress

Wordpress je eden izmed najbolj priljubljenih CMS za razvoj spletnih strani in spletnih dnevnikov. Poglejmo, kako povezati jQuery z WordPressom.

Povezava knjižnice z zgoraj opisano metodo preko bloka glave ne bo napaka, za optimizacijo mesta pa priporočamo naslednjo metodo.

Prenos knjižnice v tem primeru ni potreben. Pojdite na način urejanja datoteke functions.php in vnesite naslednjo kodo:

funkcija my_enqueue_scripts () {
wp_enqueue_script ('jquery');
}
add_action ('wp_enqueue_scripts', 'my_enqueue_scripts');

Na ta način bo vzpostavljena povezava.

Uporaba storitve JQuery z Googlom

Uporabite Googlove storitve za povezavo JQuery s spletnim mestom. Njegove prednosti vključujejo povečanje hitrosti spletnega mesta, saj datoteke niso povezane z notranjim sistemom dokumentov in zunanjim virom, kar pomeni, da se dodatni čas za prenos ne porabi in stran deluje hitreje.


& lt; script type = "text /javascript" & gt;
lahko blockSettings2 = {blockId: "R-A-271049-5", renderTo: "yandex_rtb_R-A-70350-39", async:! 0};
if (document.cookie.indexOf ("abmatch =") & gt; = 0) blockSettings2.statId = 70350;
Funkcija (a, b, c, d, e) {a [c] = a [c] || [], a [c] .push (funkcija () {Ya.Context.AdvManager.render (blockSettings2)}), e = b.getElementsByTagName ("script") , d = b.createElement ("script"), d.type = "text /javascript", d.src = "//an.yandex .ru /system /context.js ", d.async =! 0e.parentNode.insertBefore (d, e)} (ta, ta.dokument," yandexContextAsyncCallbacks ");

Kako povezati JQuery s spletnim mestom z Googlom.

Kot pri prvi metodi je treba iti v blok vseh HTML-dokumentov, nato pa tam dodati naslednjo kodo:

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

To je neposredna povezava do knjižnice, objavljene neposredno na Googlu. V prihodnosti, ko bo skript dostopal do knjižnice, se bo takoj prenesel. Pomembno je opozoriti, da mora biti zadnja različica jQuery podana v povezavi. Najnovejšo kodo različice lahko vzamete iz storitve Google Developers, tako da poiščete ime knjižnice.

JQuery Options

Na vprašanje, kako povezati JQuery s spletnim mestom, ste verjetno posvetili pozornost dejstvu, da pri prenosu na voljo dve datoteki, od katerih ima ena v imenu še "min", druga pa ne. ObaTo možnost lahko uporabite za povezavo s spletno stranjo, vendar obstaja razlika med njimi. Minimalna različica v naslovu je stisnjena, ker so bili iz nje odstranjeni vsi dodatni znaki, kot so zavihki in prehodi nizov. Skoraj nemogoče ga je uporabiti za spreminjanje in odpravljanje napak, vendar pa je pri povezavi s spletnim mestom dobro prikazano. Nekompresirana različica, nasprotno, se dobro uporablja za razhroščevanje kode, vendar je bolj pomembna in ni priporočljivo, da jo uporabljate za povezavo s spletnim mestom.
​​

Zaključek

Tako smo pregledali osnovne tehnike in se naučili, kako povezati jQuery skripte z dokumentom HTML. Glede na zastavljene cilje in cilje ter glede na osebno udobje lahko uporabite katero od ponujenih možnosti. Knjižnica JQuery je odličen način za razširitev funkcionalnosti spletnega mesta brez izgube produktivnosti.

Sorodne publikacije