Le origini di JavaScript, DOM

Le origini di JavaScript

JavaScript è stato sviluppato da Netscape, in collaborazione con Sun Microsystems. Prima di JavaScript, browser web sono abbastanza fondamentali pezzi di software in grado di visualizzare documenti ipertestuali. JavaScript è stato presentato successivamente aggiungere qualche spezia in più per pagine web e per renderli più interattivi. La prima versione, JavaScript 1.0, ha debuttato in Netscape Navigator 2 nel 1995. Al tempo di JavaScript 1.0 's release, Netscape Navigator ha dominato il mercato dei browser. Microsoft stava lottando per raggiungere con il suo browser, Internet Explorer, e si è affrettato a seguire l'esempio di Netscape, rilasciando il suo linguaggio VBScript propria, insieme a una versione di JavaScript chiamato JScript, con la consegna di Internet Explorer 3. Come risposta a questo, Netscape e Sun insieme circa la standardizzazione della lingua, insieme alla European COMPUTER Manufacturers UnASSOCIAZIONE (ECMA).

Il risultato è stato ECMAScript, ancora un altro nome per la stessa lingua. Anche se il nome non è mai veramente bloccato, dovremmo essere davvero riferimento a JavaScript come ECMAScript. JavaScript, ECMAScript, JScript, qualunque cosa si voglia chiamare, era guadagnando terreno entro il 1996. Versione 3 browser di Netscape e Microsoft sia supportato il linguaggio JavaScript 1.1 a vari livelli. Vorrei sottolineare che JavaScript non ha nulla a che fare con Java, un linguaggio di programmazione sviluppato da Sun Microsystems. JavaScript è stato originariamente sarebbe dovuto chiamare LiveScript. "JavaScript" è stato probabilmente scelto per rendere il suono nuovo linguaggio, come è stato in buona compagnia. Purtroppo, la scelta di questo nome in realtà aveva solo l'effetto di confondere le due lingue in testa alla gente, una confusione che è stata amplificata dal fatto che i browser Web supportato anche una forma di lato client Java. Tuttavia, mentre la forza di Java consiste nel fatto che esso può essere teoricamente impiegato in quasi tutti gli ambienti, JavaScript è sempre stato destinato per i confini del browser web. JavaScript è un linguaggio di scripting.

Ciò significa che a differenza di un programma che fa tutto per sé, il linguaggio Javascript dice semplicemente il web browser che cosa fare. Il browser interpreta lo script e fa tutto il lavoro, che è il motivo per JavaScript è spesso paragonato sfavorevole con la compilazione dei linguaggi di programmazione come Java e C + +. Ma relativa semplicità JavaScript è anche la sua forza. Perché ha una bassa barriera di ingresso, non programmatori che volevano tagliare e incollare gli script nelle loro pagine web esistenti rapidamente adottato la lingua. Javascript anche offerto agli sviluppatori la possibilità di manipolare gli aspetti del browser web. Ad esempio, la lingua può essere utilizzati per manipolare le proprietà di una finestra del browser, come la sua altezza, la larghezza e la posizione. Affrontare stesse proprietà del browser in questo modo può essere pensato come un Browser Object Model (BOM). Le prime versioni di Javascript anche fornito una sorta di primitiva Document Object Model.

Che cosa è un Document Object Model?

In breve, un Document Object Model (DOM) è un modo di concettualizzare il contenuto di un documento. Nel mondo reale, abbiamo tutti qualcosa in comune chiamerò un mondo Object Model. Possiamo fare riferimento a oggetti nel nostro ambiente, usando termini come "macchina", "casa" e "albero" e di essere abbastanza certi che i nostri termini sarà capito. Questo perché abbiamo concordato gli oggetti su cui le parole si riferiscono in modo specifico. Se io dico "La macchina è in garage," è lecito ritenere che non si avrà che significa "L'uccello è nella credenza." Our World Object Model non è limitata ad oggetti tangibili, anche se si applica anche ai concetti.

Per esempio, avrei potuto fare riferimento a "la terza casa a sinistra", quando si danno le direzioni. Per tale descrizione di dare un senso, i concetti di "terzi" e "sinistra" deve essere intesa. Se mi danno che la descrizione di qualcuno che non può contare, o che non si può dire da destra a sinistra, quindi la descrizione è essenzialmente privo di senso, se non le parole sono state comprese. In realtà, perché la gente d'accordo su un modello concettuale del mondo , le descrizioni molto breve può essere piena di significato. Posso essere abbastanza sicuro che gli altri a condividere i miei concetti di "sinistra" e "terza". E 'la stessa situazione con le pagine web. Le prime versioni di JavaScript ha offerto agli sviluppatori la possibilità di eseguire query e manipolare alcuni dei contenuti effettivi dei documenti sul web la maggior parte delle immagini e forme. Poiché i termini "immagini" e "forme" era stato predefiniti, JavaScript potrebbe essere utilizzato per affrontare "la terza immagine nel documento" o "il modulo di nome 'dettagli'", come indicato:

document.images [2] document.forms [ 'details']

Questo primo, specie tentativo di Document Object Model è spesso denominato DOM Level 0. In quei primi giorni spensierati, l'utilizzo più comune di DOM Level 0 è stato di rollover di immagini e di alcuni client-side di convalida form. Ma quando la quarta generazione di browser di Netscape e Microsoft comparso, il DOM veramente colpito il ventilatore.

Il browser guerre

Netscape Navigator 4 (NN4) è stata rilasciata nel giugno 1997, e da ottobre dello stesso anno, Internet Explorer 4 (IE4) erano stati liberati. Entrambi i browser promesso molti miglioramenti alle versioni precedenti, con molte aggiunte a quella che potrebbe essere realizzato con JavaScript, utilizzando un notevolmente ampliata DOM. Web designer sono stati invitati a provare la parola chiave più recenti: DHTML.

La parola D: DHTML

DHTML è stato breve per HTML dinamico. Non è una tecnologia in sé e per sé, DHTML era un termine scorciatoia per descrivere il matrimonio di HTML, CSS e JavaScript. Il ragionamento alla base di DHTML è andato così: Si potrebbe usare l'HTML per contrassegnare la tua pagina web in elementi. Si potrebbe usare i CSS per lo stile e la posizione di tali elementi. Si potrebbe utilizzare JavaScript per manipolare e modificare gli stili al volo. DHTML di cui al combinazione di queste tre tecniche. Usando DHTML, effetti di animazione complessa sia improvvisamente diventato possibile. Diciamo che si è utilizzato HTML per marcare un elemento della pagina come questa:

Questo è il mio elemento

È quindi possibile utilizzare i CSS per applicare gli stili di posizionamento come questo:

# myElement (position: absolute; left: 50px; top: 100px;)

Quindi, utilizzando JavaScript, è possibile modificare gli stili di sinistra e in alto di myElement per spostarlo all'interno della pagina. Bene, che era la teoria comunque. Sfortunatamente per gli sviluppatori, entrambi i browser utilizzati diversi, DOM incompatibili. Sebbene i produttori di browser sono stati promuovere le stesse finalità, ciascuna di esse affrontato il problema DOM in modi completamente diversi.

Clash of the browser

DOM Netscape fatto uso di elementi proprietario chiamato strati. Questi strati hanno avuto un ID univoco e quindi affrontati con JavaScript come questo:

document.layers [ 'myElement']

Nel frattempo, il DOM di Microsoft avrebbe affrontato lo stesso elemento come questo:

document.all [ 'myElement']

Le differenze non finiscono qui. Diciamo che si vuole trovare la posizione della sinistra myElement e assegnarlo alla variabile xpos. In Netscape Navigator 4 si farebbe in questo modo:

var xpos = document.layers [ 'myElement']. sinistra;

Ecco come si potrebbe fare la stessa cosa in Internet Explorer 4:

var xpos = document.all [ 'myElement']. leftPos;

Questo è stato chiaramente una situazione ridicola. Gli sviluppatori hanno dovuto forcella il loro codice di realizzare qualsiasi tipo di script DOM. In effetti, molti script sono state scritte due volte, una volta per NN4 e una volta per IE4. Convoluted browser sniffing è stato spesso richiesto di servire lo script corretto. DHTML promesso un mondo di possibilità. Ma chi in realtà ha cercato di usarlo scoperto un mondo di dolore, invece. Non passò molto tempo prima di DHTML è diventato uno sporco (buzz) word. La tecnologia rapidamente guadagnato la reputazione di essere entrambi over hyped e troppo difficile da attuare.

Elevare gli standard

Mentre i produttori di browser sono stati impegnati impegnandosi nella loro battaglia per la supremazia, e usando DOM concorrenti come armi nella loro guerra, il W3C è stato tranquillamente mettere insieme uno standard Document Object Model. Per fortuna, i venditori browser sono stati in grado di mettere da parte la loro ostilità reciproca. Netscape, Microsoft e altri produttori di browser lavorato insieme con il W3C sul nuovo standard e DOM Level 1 è stato completato nel mese di ottobre 1998. Tornando al nostro esempio, diamo uno sguardo a come il nuovo standard DOM consentirebbe di affrontare la stessa situazione. Ricordate, abbiamo un

con la myElement ID e stiamo cercando di verificare il valore che è stato applicato per la sua posizione di sinistra in modo da poter memorizzare tale valore come il xpos variabile. Ecco la sintassi si usa:

var xpos = document.getElementById ( 'myElement'). style.left

A prima vista, che potrebbero non sembrano essere un miglioramento rispetto alla non-standard, DOM proprietario. Tuttavia, il DOM standard è molto più ambizioso nel suo campo di applicazione. Mentre i produttori di browser semplicemente voluto in qualche modo per manipolare le pagine web con JavaScript, il W3C ha proposto un modello che potrebbe essere utilizzato da qualunque linguaggio di programmazione per manipolare qualunque documento scritto in qualunque Markup Language.

Pensare al di fuori del browser

Il DOM è ciò che è conosciuto come uno Application Programming Interface (API). API sono essenzialmente le convenzioni che sono state concordate con il consenso reciproco. Real-equivalenti mondo sarebbe cose come:

Codice Morse
Zone International tempo
La tavola periodica degli elementi

Tutte queste cose sono standard, e rendono più facile per le persone di comunicare e collaborare. In situazioni in cui una convenzione unica non è stato concordato, il risultato è spesso disastroso. Ricordate, la concorrenza tra misure metriche e imperiali ha provocato almeno una missione su Marte non era riuscita. Nel mondo della programmazione, ci sono molte lingue diverse, ma ci sono molte funzioni analoghe. È per questo che le API sono così a portata di mano. Una volta che conosci lo standard, è possibile applicarlo in molti ambienti diversi. La sintassi può variare a seconda della lingua che stai usando, ma la convenzione rimane la stessa.

Così, mentre ci si concentrerà in particolare sull'uso del DOM con JavaScript in questo articolo, la vostra nuova conoscenza del DOM sarà anche molto utile se mai hai bisogno di analizzare un documento XML utilizzando un linguaggio di programmazione come PHP o Python. Il W3C definisce il DOM come "una piattaforma e l'interfaccia di un linguaggio neutro che permetterà programmi e script di accedere e aggiornare dinamicamente il contenuto, la struttura e lo stile dei documenti." L'indipendenza del DOM standard, insieme con il suo campo di applicazione potente, lo mette la testa e le spalle al di sopra del DOM di proprietà generati dai produttori di browser battibecco.

La fine della guerra dei browserMicrosoft ha vinto la battaglia per la supremazia del mercato browser-share. Ironia della sorte, lo scontro di DOM concorrenti e markup proprietari ha avuto poco effetto sul risultato finale. Internet Explorer è stato destinato a vincere solo in virtù del fatto che è preinstallato su tutti i PC che eseguono il sistema operativo Windows. Le persone che sono state duramente colpite dalla guerra dei browser erano web designer. Lo sviluppo cross-browser era diventato un incubo. Come pure le differenze nelle implementazioni JavaScript che ho menzionato in precedenza, i due browser aveva anche livelli molto diversi di sostegno per i CSS. La creazione di fogli di stile e script che ha lavorato su entrambi i browser sono diventati una specie di magia nera. Un gioco ha iniziato contro la posizione di proprietà dei produttori di browser.

Un gruppo è stato formato che si fa chiamare WEB SORME Progetto, o il WaSP in breve (http://webstandards.org/). Il primo compito che il WaSP impegnata è quello di incoraggiare i responsabili del browser di adottare le raccomandazioni del W3C-le raccomandazioni stesso che i produttori di browser ha contribuito alla stesura. Sia che si tratti era dovuta alla pressione della vespa o il risultato di decisioni aziendali interne, si è di gran lunga maggiore supporto per gli standard Web nella prossima generazione di browser web.

Un nuovo inizio

Internet Explorer 5 fornito con il supporto incorporato per il DOM standard WC3, pur mantenendo il supporto per i vecchi, proprietarie di Microsoft DOM. Netscape ha deciso di dare un taglio netto e rilasciato un browser che aveva quasi nulla in comune con NN4. Netscape Navigator 6, anche saltato un numero di versione, e ha utilizzato un motore di rendering completamente diverso, con molto, molto maggiore supporto CSS. Ha inoltre sostenuto il DOM standard, ma senza retrocompatibilità per il vecchio Netscape DOM. Versioni successive sia da Netscape e Microsoft migliorato le incarnazioni precedenti, con un maggiore supporto per gli standard web. Purtroppo, lo sviluppo di Internet Explorer è rimasto fermo alla versione 6. Questo è un peccato, come se sussistono alcuni problemi con l'attuazione del browser di CSS. Il supporto per DOM Level 1, tuttavia, è solida roccia. Nel frattempo, gli altri browser sono apparsi sulla scena. Quando Apple ha debuttato il suo browser web Safari, nel 2003, non vi era alcun dubbio che l'intenzione di seguire gli standard DOM.

Firefox, Mozilla, Camino e, tutti basati sullo stesso motore di rendering open-source come Netscape 6 e 7, sono un eccellente supporto per il DOM. Opera e Konquerer offrono anche il supporto DOM grande. Oltre il 95% dei browser in uso attivo oggi sono dotati di supporto per il DOM. La guerra dei browser della fine degli anni Novanta sembrano essere veramente bene e dietro di noi. Anche se non unico browser ha attuato il DOM W3C perfettamente, tutti i browser moderni coprono circa il 95% del capitolato d'oneri. Ciò significa che c'è una quantità enorme che si può realizzare senza doversi preoccupare di ramificazione codice. La fase di stagnazione dello sviluppo di Internet Explorer, nonostante, la vita è migliorata notevolmente per i web designer. Invece di scrivere gli script con codice biforcuta servito con browser sniffing complicata, siamo ora in grado di scrivere qualcosa, una volta e pubblicare ovunque. Finché seguiamo gli standard DOM, possiamo essere sicuri che il nostro script funziona quasi universalmente.

What's next?

Una cosa che dovete assolutamente togliere dalla mia lezione di JavaScript breve storia è che i vari browser utilizzati per svolgere gli stessi compiti in modi diversi. Questo fatto ineluttabile, non solo ha dominato la scrittura di script JavaScript, dettata anche come articoli sono stati scritti su JavaScript. Tutti gli articoli JavaScript volta a dimostrare come l'apprendimento della lingua con l'esempio, spesso ha dovuto mostrare la stessa script scritti in modi diversi per browser diversi. Proprio come il codice trovato su siti più, gli esempi nella maggior parte dei articoli JavaScript erano pieni di browser sniffing e il codice di ramificazione. Allo stesso modo, articoli tecnici di riferimento su JavaScript non può limitarsi a contenere gli elenchi delle funzioni e metodi. Avevano anche al documento che funzioni e metodi sono stati supportati dai vari browser. La situazione è cambiata ora.

Grazie alla standardizzazione del DOM, diversi browser fare le stesse cose più o meno allo stesso modo. Ciò significa che quando sto mostrando come fare qualcosa utilizzando JavaScript e il Document Object Model, non avremo distrarre dalle incoerenze browser. Vado a cercare di evitare che citano qualsiasi browser specifico in questo articolo. Sono anche non andare a usare il termine DHTML più. Il termine sempre lavorato meglio come uno slogan di marketing che come una descrizione tecnica. Per prima cosa, sembra confuso come un altro sapore di HTML o XHTML. Inoltre, il termine viene fornito con un sacco di bagagli. Se si DHTML parlare a chi ha cercato di utilizzarlo negli anni novanta, avrai un momento difficile convincerli che si tratta di un semplice, la tecnologia standardizzata ora. DHTML doveva fare riferimento alla combinazione di (X) HTML, CSS, e JavaScript, ma in realtà, ciò che unisce queste cose insieme è il DOM. Se abbiamo bisogno di alcun termine per descrivere questo processo, usiamo qualcosa di più preciso. Mentre il termine DHTML potrebbe essere usata per riferirsi al browser di codifica specifici, non mi sembra giusto cercare di applicare lo stesso termine, basata su standard di codifica.

DOM Scripting è un modo più preciso per descrivere la manipolazione di documenti e fogli di stile utilizzando il W3C Document Object Model. DHTML considerando che si riferiva solo ai documenti web, DOM Scripting può essere utilizzato in combinazione con qualsiasi marcata-up documento utilizzando qualsiasi linguaggio che supporta le API DOM . Nel caso di documenti web, l'onnipresenza di JavaScript rende la scelta migliore per DOM Scripting.

un articolo presentato da Jacques Goudreau

Disclaimer:Il nostro sito non è responsabile per il contenuto di questo articolo. Webarticles è una risorsa gratuita di informazioni.
Importante: Questo articolo "Le origini di JavaScript, DOM" è stato tradotto da un software automatico. Ci dispiace per eventuali errori di ortografia che possono essersi verificati. Grazie per la vostra comprensione.