✅ HTML5 - Oggetto posizione

Sommario

L'oggetto Posizione è uno dei tanti a cui possiamo accedere grazie a SOLE, Questo ci consente di ottenere informazioni rilevanti sull'indirizzo del documento e consente anche la navigazione verso altri documenti.
L'oggetto posizione
Come abbiamo accennato all'inizio, l'oggetto Posizione ci consente di accedere alle proprietà della posizione del nostro documento tramite il SOLE, in modo da poter ottenere informazioni dettagliate sugli indirizzi e su come navigare verso altri documenti.
Per ottenere tutto questo, abbiamo le seguenti proprietà e metodi che possiamo usare quando chiamiamo questo oggetto, vediamo l'elenco e cosa fa ciascuno:

· protocollo: Ottiene o imposta il componente del protocollo dell'URL del documento.

· ospite: Ottiene o imposta il componente host dell'URL del documento.

· href : Ottiene o imposta la posizione del documento corrente.

· Nome host: Ottiene o imposta il nome host dell'URL del documento.

· porta: Ottiene o imposta il componente della porta dell'URL del documento.

· percorso: Ottiene o imposta il percorso o il componente del percorso dell'URL del documento.

· ricerca: Ottiene o imposta il componente di query dell'URL del documento.

· hash : Ottiene o imposta un componente hash per l'URL del documento.

· assegnare (): Vai all'URL specificato.

· sostituire (): Rimuovi il documento corrente e vai a quello specificato nell'URL.

· ricarica (): Ricarica o aggiorna il documento corrente.

· risolveURL(): Risolve l'URL relativo specificato in un percorso assoluto.

Molto bene, ora che sappiamo cosa abbiamo, vedremo un piccolo esempio di come ottenere tutte queste informazioni in un documento usando Javascript all'interno del nostro documento HTML.

 Esempio

Vediamo come questo viene interpretato nel browser; Per dimostrare la funzionalità di ricerca e hash che utilizziamo ? query = mele # mele in modo che possiamo vedere come lo prende il browser, sotto il risultato nell'immagine seguente:

Usa l'oggetto posizione per navigare in un'altra pagina
Come accennato in precedenza, possiamo anche utilizzare l'oggetto location per navigare in un altro sito, ovvero per andare in un altro documento, ci sono diversi modi per farlo, tuttavia vedremo uno dei più semplici questa volta in un dimostrativo A proposito, prima vediamo il codice che dobbiamo generare e poi spiegheremo come funziona:

Esempio

Ci sono molti tipi diversi di frutta - ci sono oltre 500 varietà di banane da sole. Quando aggiungiamo gli innumerevoli tipi di mele, arance e altri frutti ben noti, ci troviamo di fronte a migliaia di scelte.

premimi

Uno degli aspetti più interessanti della frutta è la varietà disponibile in ogni paese. Vivo vicino a Londra, in una zona nota per le sue mele.

In questo codice facciamo semplicemente quanto segue, prima stabiliamo che nell'elemento con l'id pressme andremo ad includere una nuova funzione quando ci clicchi sopra, questo grazie all'evento onclick, quindi all'interno della funzione che si attiva quando fai clicca usiamo l'oggetto documento.posizione.hash e abbiniamo il valore dell'hash a cui andremo a navigare, in questo caso banana è un'immagine che abbiamo incluso come id di un elemento image img.
Vediamo come appare nel nostro browser:

INGRANDIRE

Come possiamo vedere, è un comportamento molto utile e lo otteniamo in un modo molto semplice utilizzando l'oggetto posizione.
Un altro modo potrebbe essere utilizzare il metodo di sostituzione che avevamo elencato in precedenza, tuttavia la particolarità di sostituire è che sostituisce il documento corrente con quello che riceve come parametro, eliminando così dalla cronologia il documento che lo ha chiamato, quindi il pulsante indietro il browser non porterebbe da nessuna parte.Ti è piaciuto e hai aiutato questo Tutorial?Puoi premiare l'autore premendo questo pulsante per dargli un punto positivo