HTML id attribute

Definitie en gebruik

id De eigenschap definieert de unieke id van een HTML-element. (Deze waarde moet uniek zijn in het HTML-document).

id De eigenschap wordt meestal gebruikt om naar stijlen in een stijlblad te verwijzen, en om elementen met een specifieke id te manipuleren met behulp van JavaScript (via HTML DOM).

id De eigenschap kan ook als linkanker (link anchor) worden gebruikt.

Zie ook:

HTML handleiding:HTML id

HTML handleiding:HTML attributes

CSS handleiding:CSS syntax

CSS referentiehandleiding:CSS #id Selector

HTML DOM referentiehandleiding:HTML DOM getElementById() methode

HTML DOM referentiehandleiding:HTML DOM id-eigenschap

HTML DOM referentiehandleiding:HTML DOM Style object

Voorbeeld

Voorbeeld 1

Gebruik de id-eigenschap om een tekstvak met JavaScript te wijzigen:

<html>
<body>
<h1 id="myHeader">Hallo Wereld!</h1>
<button onclick="displayResult()">Tekst wijzigen</button>
<script>
function displayResult() {
  document.getElementById("myHeader").innerHTML = "Have a nice day!";
}
</script>
</body>
</html>

Try it yourself

Meer voorbeelden zijn beschikbaar onderaan de pagina.

Syntax

<element id="id">

Eigenschapswaarde

Waarde Beschrijving
id

Specificeer een unieke id voor het element. Naamregels:

  • Moet ten minste één teken bevatten
  • Mag geen spaties bevatten

Meer voorbeelden

Voorbeeld 2

Gebruik de id-eigenschap om te linken naar een element met een specifieke id in de pagina:

<html>
<body>
<h2><a id="top">Een bepaalde titel</a></h2>
<p>Heel veel tekst ....</p>
<p>Heel veel tekst ....</p>
<p>Heel veel tekst ....</p>
<a href="#top">Terug naar het begin</a>
</body>
</html>

Try it yourself

Example 3

Use the id attribute to style text with CSS:

<html>
<head>
<style>
#myHeader {
  color: red;
  text-align: center;
}
</style>
</head>
<body>
<h1 id="myHeader">CodeW3C.com is the best!</h1>
</body>
</html>

Try it yourself

Browser support

Chrome Edge Firefox Safari Opera
Chrome Edge Firefox Safari Opera
Support Support Support Support Support