Hvordan dynamisk HTML (DHTML) brukes til å lage interaktive sider

click fraud protection

Dynamisk HTML er egentlig ikke en ny spesifikasjon av HTML, men snarere en annen måte å se på og kontrollere standard HTML-koder og kommandoer.

Når du tenker på dynamisk HTML, må du huske kvalitetene til standard HTML, spesielt at når en side er lastet fra serveren, vil den ikke endres før en annen forespørsel kommer til serveren. Dynamisk HTML gir deg mer kontroll over HTML-elementene og lar dem endres når som helst uten å gå tilbake til webserveren.

Det er fire deler til DHTML:

  • Document Object Model (DOM) (definisjon)
  • Skript
  • Cascading Style Sheets (CSS)
  • XHTML

DOM

DOM er det som lar deg få tilgang til hvilken som helst del av websiden din for å endre den med DHTML. Hver del av en webside er spesifisert av DOM, og ved hjelp av dens konsekvente navnekonvensjoner kan du få tilgang til dem og endre egenskapene.

Skript

Skript skrevet i JavaScript eller ActiveX er de to vanligste skriptspråkene som brukes til å aktivere DHTML. Du bruker et skriptspråk for å kontrollere objektene som er spesifisert i DOM.

instagram viewer

Cascading Style Sheets

CSS brukes i DHTML for å kontrollere utseendet på websiden. Stilark definerer tekstene og tekstene, bakgrunnsfargene og bildene og plasseringen av objekter på siden. Ved å bruke skript og DOM kan du endre stilen til forskjellige elementer.

XHTML

XHTML eller HTML 4.x brukes til å lage selve siden og bygge elementene for CSS og DOM å jobbe med. Det er ikke noe spesielt med XHTML for DHTML - men å ha gyldig XHTML er enda viktigere, siden det er flere ting som fungerer fra det enn bare nettleseren.

Funksjoner av DHTML

Det er fire hovedfunksjoner i DHTML:

  1. Endring av tagger og egenskaper
  2. Sanntids posisjonering
  3. Dynamiske skrifttyper (Netscape Communicator)
  4. Databinding (Internet Explorer)

Endring av tagger og egenskaper

Dette er en av de vanligste bruksområdene av DHTML. Det lar deg endre kvalitetene til en HTML-tag avhengig av en hendelse utenfor nettleseren (for eksempel et museklikk, klokkeslett eller dato, og så videre). Du kan bruke dette til å forhåndslaste informasjon på en side, og ikke vise den med mindre leseren klikker på en bestemt lenke.

Sanntids posisjonering

Når folk flest tenker på DHTML, er dette det de forventer. Objekter, bilder og tekst beveger seg rundt på websiden. Dette kan tillate deg å spille interaktive spill med leserne eller animere deler av skjermen.

Dynamiske skrifttyper

Dette er en bare Netscape-funksjon. Netscape utviklet dette for å komme rundt problemet designere hadde med å ikke vite hvilke skrifter som ville være på et lesersystem. Med dynamiske skrifter blir skriftene kodet og lastet ned med siden, slik at siden alltid ser ut som designeren hadde til hensikt. Du kan også bruke websikre skrifter.

Databinding

Dette er en eneste IE-funksjon. Microsoft utviklet dette for å gi lettere tilgang til databaser fra nettsteder. Det er veldig likt å bruke CGI for å få tilgang til en database, men bruker en ActiveX-kontroll for å fungere. Denne funksjonen er veldig avansert og vanskelig å bruke for begynnelsen av DHTML-forfatteren.

instagram story viewer