Gestione delle Finestre in JavaScript

L’oggetto window è la radice del DOM dal quale discendono tutti gli altri elementi che costituiscono il documento e la finestra che lo contiene. JavaScript permette la gestione ed il controllo delle finestre del browser e di tutti gli elementi inglobati in esse, ovviamente con le opportune restrizioni del caso ( ad esempio non è possibile leggere la lista dei preferiti ).
Aprire una nuova finestra significa accedere a nuovi contenuti senza perdere di vista quelli precedenti. Con l’HTML è possibile aprire il contenuto di un link in una nuova finestra o tab nei nuovi browser attraverso l’uso di target=”_blank”, ma con JavaScript si ha un controllo più avanzato. Il metodo per aprire una nuova finestra è:

window.open(url, nome, caratteristiche, replace)

Il primo argomento è l’indirizzo del documento da mostrare nella nuova finestra, il secondo è il nome della nuova finestra e funziona anche da identificativo, il terzo sono in realtà tutta una serie di caratteristiche come la lunghezza, l’altezza, la posizione nello schermo o se la finestra può essere ridimensionata ( trovate tutte le caratteristiche nello studio teorico del metodo che potete trovare su qualsiasi sito che si occupa di JavaScript, come questo ), infine l’ultimo di tipo booleano che indica se l’indirizzo crea un nuovo valore o ne rimpiazza uno nella cronologia. Come esempio creiamo un documento test.html e lo inseriamo in una nuova finestra dalla pagina index.html.

<!-- File Test.html -->

<html>
<head><title>Documento Nuovo</title></head>
<body>
<center><h1>Documento Nuovo</h1></center>
</body>
</html

<!-- File Index.html -->

<html>
<head><title>Documento Principale</title>

<script language="javascript">

function open_window()
{
   window.open("test.html", "_blank", 
         "left=100, top=100, width=200, height=200")
}

</script>

</head>
<body>

<input type="button" value="Apri Documento"
        onclick="open_window()" />

</body>
</html

Per chiudere la finestra con la quale si sta lavorando basta richiamare il metodo window.close(), altrimenti occorre richiamare il metodo per l’oggetto creato in precedenza, infatti il metodo window.open(…) restituisce un nuovo oggetto finestra.

var nf = window.open(“test.html”, …);
nf.close(); 

Possiamo operare su una finestra anche attraverso altri metodi, modificarne le dimensioni, modificarne la posizione o spostare la barra di scorrimento del documento. La barra degli indirizzi del browser è individuata da window.location, grazie a questa è possibile leggere o  indirizzare il browser verso un determinato indirizzo, infatti è accessibile la stringa window.location.href che non è altro che l’indirizzo della barra del browser. Da segnalare anche window.location.reload() che equivale alla pressione del tasto F5 per ricaricare il documento.
La barra di stato è utilizzata per mostrare dei messaggi all’utente, grazie a window.status è possibile accedervi inserendo messaggi personalizzati. Altro oggetto particolarmente interessante è window.history che non è altro che la cronologia del browser ed è così possibile navigarvici in avanti ed indietro.
Altre finestre molto importanti gestibili con JavaScript sono le modali, ossia quelle che servono per dare informazioni oppure avere dei semplici input dall’utente. I metodi sono alert(), confirm() e prompt(). Il primo mostra semplicemente un messaggio al visitatore, il secondo permette all’utente di dare una risposta affermativa o negativa ad una domanda ed infine il terzo che permette al visitatore di inserire un input da tastiera restituendolo sotto forma di stringa.

Informazioni su Giampaolo Rossi

Sviluppatore di software gestionale da oltre 28 anni.
Questa voce è stata pubblicata in Internet, Programmazione e contrassegnata con . Contrassegna il permalink.