Le interazioni con il browser sono molto importanti. Ad esempio, per aprire una pagina con JavaScript o cambiare un elemento HTML. In questa lezione, vediamo come funziona l'oggetto window.
L'oggetto window
L'oggetto window permette di interagire con la finestra del browser. Tutto quello che appare nella finestra del browser viene memorizzato all'interno di window.
Ad esempio, possiamo visualizzare un alert con:
window.alert("POPUP!!");Tuttavia, spesso possiamo sottintendere window. Infatti, puoi scrivere soltanto alert().
Un altro esempio è document.getElementById(), che sarebbe:
window.document.getElementById("elemento");Nota: se vuoi approfondire getElementById(), prova a leggere Medodi di accesso al DOM.
Recuperare le proprietà della finestra del browser
Con l'oggetto window, possiamo recuperare alcune proprietà della finestra del browser dell'utente.
In particolare, window.screen salva tutte le proprietà dello schermo del browser. Tuttavia, window si può sottintendere. Ecco le quattro proprietà disponibili per recuperare le informazioni sulla dimensione dello schermo.
| Proprietà | Descrizione |
window.innerWidth | Restituisce la larghezza in pixel della finestra del browser. |
window.innerHeight | Restituisce l'altezza in pixel della finestra del browser. |
screen.width | Restituisce la larghezza in pixel dello schermo dell'utente. |
screen.height | Restituisce la larghezza in pixel dello schermo dell'utente. |
Utilizzo delle proprietà
Vediamo un esempio di come utilizzare le proprietà appena viste.
document.write("La dimensione della finestra: "+window.innerWidth+" x "+window.innerHeight+"px");
document.write("<br>");
document.write("La dimensione dello schermo: "+screen.width+" x "+screen.height+"px");