Het internet in normaal Nederlands

De WebVakman blog over HTML is nog maar kort in ontwikkeling. Heb je vragen of suggesties? Stuur ons dan even een berichtje.

Het id-attribuut

Een van de meest gebruikte attributes op een HTML-element is het id-attribute. Je gebruikt het id-attribute om een unieke waarde aan je HTML-element te geven.

Dit een een globaal attribuut (global attribute). Je kan dit attribute op elk HTML-element gebruiken.

Schrijfwijze (syntax)

  • De waarde van je id mag op de hele HTML-pagina maar één keer voorkomen.
  • De waarde van je id moet met een letter beginnen. Cijfers en bijzondere tekens mogen daarna.
  • Je mag geen spatie in je id gebruiken. Twee waarden voor een id opgeven met een spatie ertussen is dus ook niet toegestaan In dat geval wordt alleen de eerste waarde gebruikt.
  • Je mag bijzondere tekens gebruiken.
  • Je mag hoofdletters, kleine letters en cijfers gebruiken. Ook zijn sommige speciale tekens, zoals de underscore, toegestaan.
  • Het id is hoofdlettergevoeling
HTML

<!--Onderstaande elementen zijn allebei goede HTML, maar ze hebben NIET hetzelfde id.-->
<div id="product1">product</div>
<div id="Product1">product</div>

<!--Een id mag geen spaties bevatten. Onderstaand voorbeeld is dus NIET goed.-->
<div id="product 1">product</div>

<!--Op onderstaande elementen is het id WEL goed gebruikt.-->
<div id="product1">product</div>
<div id="product2">product</div>

<!--of-->
<div id="product-1">product</div>
<div id="product-2">product</div>

Om fouten te voorkomen raden we je aan om gewoon helemaal geen hoofdletters in je id te gebruiken. De enige uitzondering daarop zou zijn als je een GUID voor je id gebruikt. Die worden vaak gegenereerd zonder dat je invloed hebt op of het een hoofdletter of kleine letter is. Maar als je eenmaal zover bent dat je GUIDS in je html gaat gebruiken zal dit inmiddels gesneden koek voor je zijn. Dit advies komt voort uit het feit dat in het verleden verschillende browsers (zoals Firefox, Chrome, Internet Explorer en Netscape Navigator) de hoofdlettergevoeligheid anders hebben gebruikt. Door de hoofdletters in id’s niet te gebruiken voorkom je onnodige fouten.

Id’s worden net als classnames gebruikt voor het selecteren van HTML-elementen. Deze selectie wordt gebruikt bij het opmaken van de layout voor de elementen in CSS en bij het programmeren van extra functionaliteit in JavaScript.