Obiectul de localizare
După cum am menționat la început, obiectul Locație ne permite să accesăm proprietățile de localizare ale documentului nostru prin SOARE, astfel încât să putem obține informații detaliate despre adrese și cum să navigăm către alte documente.
Pentru a obține toate acestea, avem următoarele proprietăți și metode pe care le putem folosi atunci când apelăm acest obiect, să vedem lista și ce face fiecare:
· protocol: Obține sau setează componenta de protocol a adresei URL a documentului.
· gazdă: Obține sau setează componenta gazdă a adresei URL a documentului.
· href : Obține sau setează locația documentului curent.
· numele gazdei: Obține sau setează numele de gazdă al adresei URL a documentului.
· port: Obține sau setează componenta port a adresei URL a documentului.
· calea: Obține sau setează calea sau componenta cale a adresei URL a documentului.
· căutare: Obține sau setează componenta de interogare a adresei URL a documentului.
· hash : Obține sau setează o componentă hash pentru adresa URL a documentului.
· assign (): Navigați la adresa URL specificată.
· a inlocui (): Eliminați documentul curent și navigați la cel specificat în adresa URL.
· reload (): Reîncărcați sau reîmprospătați documentul curent.
· resolveURL (): Rezolvă URL-ul relativ specificat la o cale absolută.
Foarte bine, acum că știm ce avem, vom vedea un mic exemplu despre cum să obținem toate aceste informații într-un document folosind Javascript în documentul nostru HTML.Exemplu
Să vedem cum este interpretat acest lucru în browser; Pentru a demonstra funcționalitatea de căutare și hash pe care o folosim ? interogare = mere # mere astfel încât să putem vedea cum îl ia browserul, sub rezultatul din următoarea imagine:
Utilizați obiectul de locație pentru a naviga la o altă pagină
După cum am menționat anterior, putem folosi și obiectul de localizare pentru a naviga către un alt site, adică pentru a merge la un alt document, există mai multe moduri de a face acest lucru, cu toate acestea, vom vedea unul dintre cele mai simple de data aceasta într-un demonstrativ În primul rând, să vedem codul pe care trebuie să îl generăm și apoi vom explica cum funcționează:
ExempluExistă o mulțime de feluri diferite de fructe - există peste 500 de soiuri de banane numai. Până când adăugăm nenumăratele tipuri de mere, portocale și alte fructe cunoscute, ne confruntăm cu mii de alegeri.
Apasă pe mineUnul dintre cele mai interesante aspecte ale fructelor este varietatea disponibilă în fiecare țară. Locuiesc lângă Londra, într-o zonă cunoscută pentru merele sale.
În acest cod facem pur și simplu următoarele, mai întâi stabilim că în elementul cu ID-ul pressme vom include o nouă funcție atunci când faceți clic pe el, acest lucru datorită evenimentului onclick, apoi în cadrul funcției care este activată când faceți clic pe vom folosi obiectul document.location.hash și potrivim valoarea hashului la care urmează să navigăm, în acest caz banana este o imagine pe care am inclus-o ca id al unui element img de imagine.
Să vedem cum arată acest lucru în browserul nostru:
MARI
După cum putem vedea, este un comportament foarte util și îl realizăm într-un mod foarte simplu folosind obiectul de localizare.O altă modalitate ar putea fi utilizarea metodei de înlocuire pe care am enumerat-o anterior, cu toate acestea particularitatea înlocuirii este că înlocuiește documentul curent cu cel pe care îl primește ca parametru, eliminând astfel documentul care l-a numit din istoric, deci butonul înapoi browserul nu ar duce nicăieri.V-a plăcut și ați ajutat acest tutorial?Puteți recompensa autorul apăsând acest buton pentru a-i oferi un punct pozitiv