HTML -ID -Attribut
Beispiel
Verwenden Sie das id-Attribut, um Text mit JavaScript zu manipulieren:
<html>
<body>
<h1 id="myHeader">Hello World!</h1>
<button onclick="displayResult()">Change text</button>
<script>
function displayResult()
{
document.getElementById("myHeader").innerHTML = "Have a nice day!";
}
</script>
</body>
</html>
Weitere „Probieren Sie es selbst“-Beispiele weiter unten.
Definition und Verwendung
Das idAttribut gibt eine eindeutige ID für ein HTML-Element an (der Wert muss innerhalb des HTML-Dokuments eindeutig sein).
Das idAttribut wird am häufigsten verwendet, um auf einen Stil in einem Stylesheet zu verweisen, und durch JavaScript (über das HTML-DOM), um das Element mit der spezifischen ID zu manipulieren.
Browser-Unterstützung
| Attribute | |||||
|---|---|---|---|---|---|
| id | Yes | Yes | Yes | Yes | Yes |
Syntax
<element id="id">
Attributwerte
| Value | Description |
|---|---|
| id | Specifies a unique id for the element.
Naming rules:
|
Mehr Beispiele
Beispiel 1
Verwenden Sie das id-Attribut, um auf ein Element mit einer bestimmten ID innerhalb einer Seite zu verlinken:
<html>
<body>
<h2><a id="top">Some heading</a></h2>
<p>Lots of text....</p>
<p>Lots of text....</p>
<p>Lots of text....</p>
<a href="#top">Go to top</a>
</body>
</html>
Beispiel 2
Verwenden Sie das id-Attribut, um Text mit CSS zu formatieren:
<html>
<head>
<style>
#myHeader {
color: red;
text-align: center;
}
</style>
</head>
<body>
<h1 id="myHeader">W3Schools is the best!</h1>
</body>
</html>
Verwandte Seiten
HTML-Tutorial: HTML-ID
HTML-Tutorial: HTML-Attribute
CSS-Tutorial: CSS-Syntax
CSS-Referenz: CSS #id Selector
HTML-DOM-Referenz: HTML-DOM-getElementById()-Methode
HTML-DOM-Referenz: HTML-DOM-ID-Eigenschaft
HTML-DOM-Referenz: HTML-DOM-Stilobjekt