110 likes | 296 Views
JavaScript. DOM – Document Object Model. DOM - Document Object Model. API implementata dai browser Indipendente dal linguaggio e dalla piattaforma Forma di rappresentazione dei documenti strutturati Definisce il modo di accedere alla struttura del documento
E N D
JavaScript DOM – DocumentObjectModel
DOM - DocumentObjectModel • API implementata dai browser • Indipendente dal linguaggio e dalla piattaforma • Forma di rappresentazione dei documenti strutturati • Definisce il modo di accedere alla struttura del documento • Permette di visualizzare un documento sotto forma di albero • Gli elementi del documento sono i nodi dell’albero • Standard ufficiale del W3C http://www.w3.org/DOM/ Alice Pavarani
DOM di un documento HTML • Il browser interpretando un documento HTML ne genera il DOM • Esempio: DOCUMENT HTML HEAD BODY TITLE META H1 H2 P A Testo del paragrafo Esempio DOM Titolo Sottotitolo Link Alice Pavarani
DOM e JavaScript: gli oggetti ospite • Il DOM non è una parte di JavaScript • Il DOM è una collezione di oggetti per Javascript window navigator plugin mimeType frame document location history layer link area form anchor applet plugin image text password submit reset button textarea fileUpload hidden radio checkbox select option Alice Pavarani
Proprietà e metodi comuni Alice Pavarani
Windowproprietàhttp://www.w3schools.com/jsref/obj_window.aspWindowproprietàhttp://www.w3schools.com/jsref/obj_window.asp • Il padre di tutti gli oggetti • Rappresenta la finestra corrente del browser Alice Pavarani
Windowmetodihttp://www.w3schools.com/jsref/obj_window.asp • Il padre di tutti gli oggetti • Rappresenta la finestra corrente del browser Alice Pavarani
Documenthttp://www.w3schools.com/jsref/dom_obj_document.asp • Rappresenta il documento HTML Alice Pavarani
Locationhttp://www.w3schools.com/jsref/obj_location.asp • Contiene le informazioni riguardo l’indirizzo URL corrente • History • http://www.w3schools.com/jsref/obj_history.asp • Contiene gli indirizzi URL visitati all’interno della finestra corrente Alice Pavarani
Navigatorhttp://www.w3schools.com/jsref/obj_navigator.asp • Rappresenta il browser che visualizza la pagina Web • Fornisce informazioni sul browser Esempio tratto da http://www.w3schools.com/js/js_window_navigator.asp <script> // oggetto Navigator - Informazioni sul Browser txt = "<p>Browser CodeName: " + navigator.appCodeName + "</p>"; txt += "<p>Browser Name: " + navigator.appName + "</p>"; txt += "<p>Browser Version: " + navigator.appVersion + "</p>"; txt += "<p>CookiesEnabled: " + navigator.cookieEnabled + "</p>"; txt += "<p>Browser Language: " + navigator.language + "</p>"; txt += "<p>Browser Online: " + navigator.onLine + "</p>"; txt += "<p>Platform: " + navigator.platform + "</p>"; txt += "<p>User-agentheader: " + navigator.userAgent + "</p>"; txt += "<p>User-agentlanguage: " + navigator.systemLanguage + "</p>"; document.writeln(txt); </script> Alice Pavarani