Het document object model.
Bron: http://www.sceneone.nl/algemeen/dom.php
Titel: HTML en CSS tutorials
Auteur: Wybe Weysters
Het DOM ofwel het Document Object Model is een verzameling regels en afspraken over hoe een browser een web pagina interpreteert. Het DOM zit ingebakken in een browser en je kunt er niets aan wijzigen. Maar als je weet volgens welke basis regels het DOM werkt kun je er wel gebruik van maken. Je kúnt er niet alleen gebruik van maken, je maakt er gebruik van. Voortdurend.
Een hiërarchische structuur
Het DOM gaat uit van een hiërarchische structuur van een html pagina en dat komt goed uit, want daar
kunnen wij mooi gebruik van maken. Sinds de introductie van het DOM wordt een html pagina niet langer
gezien als een lange serie tekens, maar als een verzameling op zichzelf staande elementen (objecten) die
onafhankelijk van elkaar kunnen worden benaderd en gemanipuleerd. We noemen het DOM object georiënteerd.
Deze elementen kunnen weer hun eigen specifieke eigenschappen hebben: attributen. Ook deze attributen
zijn omschreven in het DOM.
Ouders en hun kroost
De hiërarchische structuur van een html document wordt omschreven in de vorm van parent-elementen
en child-elementen
Bovenaan in deze structuur staat het <html> element. Zeg maar de Padre de Familias, de boss of all
bosses. Het <html> element heeft twee directe 'children': <head> en <body>. Vervolgens
is bijvoorbeeld <title> weer een 'child' van <head>. Je begrijpt dat <body> niet stil
heeft gezeten en stikt van de 'children'.
Wanneer je het ene element in het andere plaatst wordt dit geneste element automatisch het 'child' van
het bovenliggende element:
<div><p>Eigenlijk is de structuur van een html document een grote<strong><em>family</em>
business</strong></p></div>
In bovenstaand voorbeeld is de <p> het 'child' van de <div>, terwijl <p> weer de 'parent' is van <strong> en <em> op zijn beurt weer het 'child' is van <strong>
Het is vooral het object georiënteerde JavaScript wat voortdurend en handig gebruik maakt van het
DOM.
Wij zullen onszelf meer concentreren op de manier waarop je via css de verschillende elementen direct
kunt benaderen en manipuleren.
Wil je meer weten over het DOM, kijk dan eens hier