Beispiel
Verwenden Sie das id - Attribut 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>
Versuch es selber " Mehr "Versuchen Sie es selbst" Beispiele unten.
Definition und Verwendung
Das id - Attribut gibt eine eindeutige id für ein HTML - Element (der Wert muss innerhalb des HTML - Dokuments eindeutig sein).
Das id - Attribut wird am häufigsten genutzt , um einen Stil in einem Stylesheet zu zeigen und von JavaScript (über das HTML - DOM) , um das Element mit dem spezifischen zu manipulieren id .
Browser-Unterstützung
| Attribut | |||||
|---|---|---|---|---|---|
| id | ja | ja | ja | ja | ja |
Unterschiede zwischen HTML 4.01 und HTML5
In HTML5, die id kann Attribut aufeinem beliebigen HTML - Element verwendet werden (es wird auf jedem beliebigen HTML - Element zu validieren. Es ist jedoch nicht unbedingt sinnvoll ist).
In HTML 4.01, die id : kann Attribut nicht verwendet werden mit <base>, <head>, <html>, <meta>, <param>, <script>, <style> und <title> .
Hinweis: HTML 4.01 hat eine größere Einschränkungen für den Inhalt der id - Werte (zum Beispiel, in HTML 4.01 - id - Werte können nicht mit einer Zahl beginnen).
Syntax
<elementid="id">
Werte Attribut
| Wert | Beschreibung |
|---|---|
| id | Gibt eine eindeutige id für das Element. Benennungsregeln:
|
Mehr Beispiele
Beispiel 1
Verwenden Sie das id - Attribut auf ein Element mit einem angegebenen Link - id innerhalb einer Seite:
<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> Versuch es selber " Beispiel 2
Verwenden Sie das id - Attribut Stil Text mit CSS:
<html>
<head>
<style>
#myHeader {
color:
red;
text-align: center;
}
</style>
</head>
<body>
<h1
id="myHeader">w3ii is the best!</h1>
</body>
</html> Versuch es selber " Verwandte Seiten
HTML - Tutorial: HTML Attribute
CSS Tutorial: CSS - Selektoren
CSS Referenz: CSS #id Selector
HTML - DOM Referenz: HTML DOM getElementById() Methode
HTML - DOM Referenz: HTML DOM id Property
HTML - DOM Referenz: HTML DOM Style - Objekt