# JavaScript/BOM

JavaScript
Copertina Tutti i moduli · Sviluppo
* IntroduzioneJavaScript/Introduzione
* Il nostro primo programmaJavaScript/Il nostro primo programma
* Tipi di dati e variabiliJavaScript/Tipi di dati e variabili
* Operatori e castingJavaScript/Operatori e casting
* Le strutture di controllo
** SelezioneJavaScript/Selezione
** IterazioneJavaScript/Iterazione
* Funzioni definite dall'utenteJavaScript/Funzioni definite dall'utente
* Programmazione ad oggettiJavaScript/Oggetti
** Oggetto StringJavaScript/Oggetto String
** Oggetto MathJavaScript/Oggetto Math
** Oggetto DateJavaScript/Oggetto Date
** Oggetto ArrayJavaScript/Oggetto Array
* CookieJavaScript/Cookie
* TimerJavaScript/Timer
* L'oggetto windowJavaScript/BOM
** Gli eventi nel BOMJavaScript/Gli eventi nel BOM
** Oggetto documentJavaScript/Oggetto document
** Altri oggetti del BOMJavaScript/Altri oggetti del BOM
* Il Document Object ModelJavaScript/DOM
** Proprietà e metodiJavaScript/Proprietà e metodi del DOM
** Gli eventi nel DOMJavaScript/Gli eventi nel DOM
* Espressioni regolariJavaScript/Espressioni regolari
* AJAX
** Introduzione ad AJAXJavaScript/Introduzione ad AJAX
** Usare AJAXJavaScript/Usare AJAX
* Costruttori e prototipiJavaScript/Costruttori e prototipi
* AppendiceJavaScript/Appendice
* CreditiJavaScript/Crediti
Modifica il sommario
Arriviamo finalmente a scoprire le funzionalità di JavaScript che lo rendono il linguaggio di scripting per le pagine web tra i più diffusi: la possibilità di interagire con il browser e la pagina HTML.
Tutto questo è possibile grazie all'oggetto window e, più generalmente, a quello che è il BOM (Browser Object Model), il modello oggetto del browser: per esso si intendono l'oggetto window tutti gli oggetti che da essi dipendono.

## L'oggetto window

L'oggetto window rappresenta la finestra del browser che contiene la pagina stessa; nella pratica, questo vuol dire avere accesso, per esempio, alle dimensioni della finestra del browser, al testo della sua barra di stato, e molto altro.
L'oggetto window è un oggetto globale, il che significa che non è necessario specificarlo per utilizzare i suoi metodi: ne è un esempio l'uso che abbiamo sempre fatto del metodo window.alert, che abbiamo sempre richiamato senza specificare l'oggetto al quale apparteneva.

### Proprietà
#### defaultStatus e status

Questa proprietà permette di ottenere o di impostare il testo predefinito della barra di stato del browser. Per esempio, sulla maggior parte dei browser, mostra la scritta "Completato" dopo l'avvenuto caricamento di una pagina. Per usarla vi accediamo semplicemente:
La seconda proprietà, status, indica invece il testo corrente nella barra di stato, ad esempio l'href di un link ipertestuale se vi sta passando sopra il mouse. Anche qui la sintassi è semplice:

#### frames, length e parent

Queste tre proprietà sono legate all'uso di frame nelle pagine web.
Essendo l'uso dei frame una tecnica piuttosto obsoleta, sorpassata oramai da tecnologie lato server e deprecata dal W3C, il loro uso non sarà approfondito nel corso di questo libro.

#### opener

Questa proprietà restituisce un riferimento all'oggetto window che ha aperto la finestra corrente (si veda più avanti il metodo open).

#### Oggetti come proprietà

La maggior parte delle proprietà dell'oggetto window sono a loro volta altri oggetti. I più importanti e utilizzati saranno trattati nel dettaglio più avanti in questo modulo e nei prossimi capitoli.

### Metodi
#### alert, confirm e prompt

Due di questi metodi, alert e prompt, sono già stati trattati in precedenza; è simile invece l'uso del metodo confirm, in quanto anch'esso mostra una finestra di dialogo. La sua sintassi è:
Il metodo mostra una finestra di dialogo che mostra il testo indicato come parametro e due pulsanti, OK e Annulla), e restituisce true se l'utente clicca su OK, false negli altri casi. Questo metodo serve per chiedere conferme all'utente prima di effettuare operazioni lunghe o importanti. Siccome un sito internet viene potenzialmente visitato da utenti di tutto il mondo, il testo sui pulsanti varia a seconda della lingua usata dal browser quindi Annulla in francese diventa Annuller, in inglese Cancel e via dicendo.

#### blur e focus

Questi due metodi rispettivamente tolgono il focus dalla finestra del browser e spostano il focus sul browser. Questo serve quando ad esempio sono aperte più finestre contemporaneamente.

#### resizeTo e resizeBy

Questi due metodi servono per ridimensionare la finestra.
Il primo è assoluto e richiede due valori interi positivi che indicano la larghezza e l'altezza che si vogliono ottenere.
Il secondo metodo invece è relativo alle dimensioni correnti della finestra e accetta due valori interi positivi e negativi che indicano di quanto si voglia ingrandire o rimpicciolire la finestra.

#### moveTo e moveBy

Questi metodi servono per spostare a proprio piacere la finestra del browser sullo schermo.
Con il primo metodo è possibile specificare le coordinate dello schermo da impostare come posizione dell'angolo superiore sinistro della finestra
Il secondo metodo richiede un valore relativo che indichi di quanto spostare la finestra in orizzontale e in verticale.
Attenzione: lo spostamento della finestra porterà al ripristino delle dimensioni della finestra se questa si trova ingrandita a tutto schermo.

#### scrollTo e scrollBy

Questi due metodi servono per effettuare lo scrolling della pagina.
Il primo metodo richiede le coordinate x e y della finestra del punto che si desidera visualizzare con lo scrolling.
Il secondo metodo è relativo e richiede un numero positivo o negativo che indichi di quanto scrollare la pagina in orizzontale o in verticale

#### print

Questo metodo serve per stampare la pagina corrente e non richiede parametri.

#### open

Questo metodo apre una nuova istanza del browser, apre cioè una nuova finestra del browser in uso. La sua sintassi è:
Il primo parametro è l'indirizzo della pagina che sarà caricata nella nuova finestra; passando una stringa vuota si otterrà una pagina vuota (in pratica, viene aperta about:blank).
Il secondo parametro indica il nome della finestra che potrà essere usato ad esempio come valore per l'attributo target dei link o dei moduli HTML o ancora da altre istruzioni JavaScript.
Il terzo parametro è invece una stringa di parametri costruita con la sintassi:
I principali parametri sono (non sono tutti compatibili con tutti i browser):
| Nome parametro | Possibili valori | Descrizione |
| copyhistory | yes, no | Copia o meno la cronologia della finestra padre nella finestra figlia |
| width, height, top, left | numero intero | Indicano rispettivamente le dimensioni e la posizione sullo schermo della finestra |
| location | yes, no | Indica se mostrare la barra dell'indirizzo |
| menubar | yes, no | Indica se mostrare la barra dei menu |
| resizable | yes, no | Abilita il ridimensionamento della finestra |
| scrollbars | yes, no | Mostra/nasconde le barre di scorrimento laterali |
| status | yes, no | Mostra la barra di stato |
| toolbar | yes, no | Mostra la barra degli strumenti |
La funzione restituisce un riferimento all'oggetto window appena aperto. Ad esempio:
Potremo poi usare il nome finestra1 nel codice HTML:
Possiamo anche creare una generica funzione, per poi creare nuove finestre partendo dai link:
e poi per usarla la inseriamo per esempio in un link:
In questo modo, grazie alla sintassi "javascript:istruzione", cliccando sul link verrà eseguita la funzione appena creata.
Dal codice della finestra aperta si potrà ottenere un riferimento alla finestra che la ha aperta tramite la proprietà window.opener.

#### close

Chiude una finestra del browser.