DHTML: dünaamiline veebikodeerimine

• Mai 17, 2024

DHTML tähistab Dynamic HyperTlisa Markup Language ja seda saab määratleda kui HTML-i veebilehtede dünaamilise muutmise kunsti, kombineerides HTML-i Javascripti ja CSS-iga. Erinevalt ülejäänud neljast HTML-i variatsioonist, mida on uuritud selle sarja neljas eelmises artiklis, pole DHTML W3 konsortsiumi määratletud standard. Pigem on see "turundustermin, mida Netscape ja Microsoft kasutasid uute tehnoloogiate kirjeldamiseks, mida 4.x põlvkonna brauserid toetaksid" (W3 Consortium). HTML 4.0 tutvustas kõigepealt kahte olulist komponenti, mis on DHTML-i struktuurile omased:

• Kaskaadlaadi lehed (CSS)
• Dokumendiobjektide mudelid (DOM)

Teie koodi muutmine dünaamiliseks

CSS pakuvad stiili- ja paigutusmudeleid, DOM aga HTML-dokumentide dokumendisisu mudeleid. JavaScript ja VBScript lisavad võimaluse skriptikoodi kirjutamiseks HTML-i elementide juhtimiseks. Need kolm komponenti moodustavad dünaamilised HTML-lehed. Üks peamine hoiatav tegur on brauserite ühildumatus - Netscape ja Microsoft pole ikka veel kokku leppinud, mida oma brauserites rakendada: seega võib mõlemas brauseris hästi toimivate DHTML-lehtede kirjutamine olla keeruline. Enda nägemiseks pääsete veebis juurde Microsofti ja Netscape'i standarditele:

• MSDN raamatukogu Microsofti juures
• Dünaamiline HTML Netscape Communicatoris

"DHTML on silmapaistev madala ribalaiusega efektide loomisel, mis suurendavad veebilehe funktsionaalsust. Seda saab kasutada animatsioonide, mängude, rakenduste loomiseks, veebisaitidel liikumiseks uute viiside loomiseks ja sellest väljapoole jäävate maailma lehekülje paigutuste loomiseks, mis lihtsalt ei tööta. See pole võimalik ainult HTML-iga. Ehkki paljusid DHTML-i funktsioone saab dubleerida kas Flashi või Java-ga, pakub DHTML alternatiivi, mis ei vaja pistikprogramme ja manustatakse sujuvalt veebilehele. "(Dan Steinman, 1998).

DHTML-i keerukuse mõistmiseks on kasulik selle komponente üksikasjalikumalt uurida.

Kaskaad-stiililehed

CSS on keerukad koodid, mis eraldavad veebisisu veebi halvustamisest - stiil, paigutus, värvid, fondid ja nii edasi. CSSP või CSS Positioning võimaldab HTML-i elementide positsioneerimist pikslitasemel kontrollida. Veebidokumentide esitlusstiili ja sisu eraldamine CSS2-ga (CSS-i tase 2) lihtsustab veebide loomist ja saidi hooldamist. "CSS2 toetab meediaspetsiifilisi stiililehti, nii et autorid võivad oma dokumentide esitluse kohandada visuaalsetele brauseritele, foneerimisseadmetele, printeritele, punktkirjaseadmetele, pihuarvutitele jne. See spetsifikatsioon toetab ka sisu positsioneerimist, allalaaditavaid fonte, tabeli paigutust, rahvusvahelistumine, automaatsed loendurid ja nummerdamine ning mõned kasutajaliidesega seotud omadused "(W3 konsortsium). W3C pakub suurepärast õpetust CSS2 õppimiseks, mida nimetatakse, CSS2 spetsifikatsioon.

JavaScript

JavaScript on spetsiaalne skriptimisbrauseripõhine keel, mida kasutatakse HTML-i elementide juhtimiseks ja vormide, raamide, akende, piltide üleviimise, audio-video juhtelementide ja DHTML-iga manipuleerimise funktsioonide lisamiseks. Netscape nimetas seda skriptimist algul JavaScriptiks, nii et Microsoft tuli oma skriptide tootemargi jaoks välja terminiga JScript. Tulemus? Kaks JavaScripti versiooni, mis võivad tüütult sobida. Selle teemaga lähemalt tutvumiseks külastage Netscape'i veebisaiti JavaScripti keskne ja Microsofti oma JScript ressursside leht. JavaScripted sisu dünaamiliste mõjude saladus on kihtobjektide kasutamine. Kihtobjektid muudavad teksti, kui hiir selle kohal kerib; see paneb pilte või teksti veebilehel liikuma; see muudab ka rippmenüüd rippmenüüdeks. Kihiobjektid on paigutatud div-siltidesse, määratledes sellised omadused nagu värv, asukoht ja nähtavus.

Pannes need kokku

DHTML-i rakendatakse tavaliselt kolme ülesande saavutamiseks:

• Asend või sisuplokkide paigutamine lehele ja nende liigutamine
• Stiili muudatused mis muudavad lehe välimust ja olemust
• Ürituste käsitlemine või kasutaja sündmuste seostamine positsioneerimise muutuste või muude stiilimuudatustega

Internet Exploreri ja Netscape'i uuemates versioonides (versioonid 5, 6 ja uuemad) on DOM muutumas enamiku DHTML-kodeeringute jaoks valitud koodiks. Kui DOM on omandatud, võib see aidata veebidisaineritel manipuleerida, lisada, kustutada ja redigeerida kõigi lehel olevate stiilide, atribuutide (näiteks href) ja elementidega (näiteks html-siltidega) seotud dokumentide kodeeringuid. See tähendab, et igale html-dokumendile ühisele sildile ja atribuudile on juurdepääs DOM-i kaudu. Praegu soovitab W3C dokumendiobjekti mudeli taset 0 ja 1. Töödes on ka 2. tase, kuid seda pole veel DHTML-kodeerimise standardiks reklaamitud.

Kasulik õpetuste rühm on saadaval HTML maiustuste kaudu, mida nimetatakse DHTML ja kihiõpetus.

Selles artiklis sisalduvad lingid pakuvad sissejuhatusi ja näpunäiteid, et alustada oma reisi html-kodeerimise uusima arengu valimisel.Kõik Google'is tehtavad kiired otsingud juhivad teie tähelepanu veel paljudele ressurssidele, mis on hõlpsalt käeulatuses saadaval. Kuna brauseritootjad tegelevad nende sobimatusega ja kõrgema versiooniga brauserite kasutamine muutub üha tavalisemaks, muutub DHTML iga professionaalse disainerite marsruudi kohustuslikuks osaks.

HTML-i esiletõstetud artiklite seeria

1. OSA: Kas usaldusväärne disainer peaks teadma HTML-i?
2. OSA: HTML 3.2 - Wilburi sünd
3. OSA: HTML 4.0 JA 4.01 - rohkem head asja!
4. OSA: XHTML: rafineeritud disaini veebikodeerimine
5. OSA: DHTML: dünaamiline veebikodeerimine

Video Juhiseid: Coding Challenge #71: Minesweeper (Mai 2024).