Hoe dynamische HTML (DHTML) wordt gebruikt om interactieve pagina's te maken

Dynamische HTML is niet echt een nieuwe specificatie van HTML, maar eerder een andere manier van kijken naar en controleren van de standaard HTML-codes en commando's.

Bij het denken aan dynamisch HTML, moet je de kwaliteiten van standaard HTML onthouden, vooral dat als een pagina eenmaal van de server is geladen, deze niet zal veranderen totdat een ander verzoek naar de server komt. Dynamische HTML geeft u meer controle over de HTML-elementen en laat ze op elk moment wijzigen, zonder terug te keren naar de webserver.

DHTML bestaat uit vier delen:

  • Document Object Model (DOM) (definitie)
  • Scripts
  • Trapsgewijze stijlbladen (CSS)
  • XHTML

DOM

De DOM is wat u toegang geeft tot elk deel van uw webpagina om deze te wijzigen met DHTML. Elk deel van een webpagina wordt gespecificeerd door de DOM en met behulp van de consistente naamgevingsconventies kunt u ze openen en hun eigenschappen wijzigen.

Scripts

Scripts die zijn geschreven in JavaScript of ActiveX zijn de twee meest voorkomende scripttalen die worden gebruikt om DHTML te activeren. U gebruikt een scripttaal om de objecten te besturen die zijn opgegeven in de DOM.

instagram viewer

Trapsgewijze stijlbladen

CSS wordt gebruikt in DHTML om het uiterlijk van de webpagina te bepalen. Stylesheets definiëren de kleuren en lettertypen van tekst, de achtergrondkleuren en afbeeldingen en de plaatsing van objecten op de pagina. Met behulp van scripting en de DOM kunt u de stijl van verschillende elementen wijzigen.

XHTML

XHTML of HTML 4.x wordt gebruikt om de pagina zelf te maken en de elementen voor de CSS en de. te bouwen DOM om aan te werken. Er is niets speciaals aan XHTML voor DHTML - maar het hebben van geldige XHTML is nog belangrijker, omdat er meer dingen mee werken dan alleen de browser.

Kenmerken van DHTML

Er zijn vier primaire kenmerken van DHTML:

  1. De tags en eigenschappen wijzigen
  2. Realtime positionering
  3. Dynamische lettertypen (Netscape Communicator)
  4. Gegevensbinding (Internet Explorer)

De tags en eigenschappen wijzigen

Dit is een van de meest voorkomende toepassingen van DHTML. Hiermee kunt u de kwaliteiten van een HTML-tag afhankelijk van een gebeurtenis buiten de browser (zoals een muisklik, tijd of datum, enzovoort). U kunt dit gebruiken om informatie vooraf op een pagina te laden en deze niet weer te geven tenzij de lezer op een specifieke link klikt.

Realtime positionering

Wanneer de meeste mensen aan DHTML denken, is dit wat ze verwachten. Objecten, afbeeldingen en tekst die over de webpagina bewegen. Hierdoor kunt u interactieve games spelen met uw lezers of delen van uw scherm animeren.

Dynamische lettertypen

Dit is alleen een functie van Netscape. Netscape ontwikkelde dit om het probleem te omzeilen dat ontwerpers hadden met het niet weten welke lettertypen op het systeem van een lezer zouden staan. Bij dynamische lettertypen worden de lettertypen gecodeerd en gedownload met de pagina, zodat de pagina er altijd uitziet zoals de ontwerper het bedoeld heeft. Je kan ook gebruiken webveilige lettertypen.

Dataverbinding

Dit is een IE-only functie. Microsoft heeft dit ontwikkeld om gemakkelijker toegang te krijgen tot: databases van websites. Het lijkt erg op het gebruik van CGI om toegang te krijgen tot een database, maar gebruikt een ActiveX-besturingselement om te functioneren. Deze functie is zeer geavanceerd en moeilijk te gebruiken voor de beginnende DHTML-schrijver.

instagram story viewer