HTMLID属性_
例
JavaScriptでテキストを操作するには、id属性を使用します。
<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>
以下の「自分で試してみてください」の例をもっと見てください。
定義と使用法
このid属性は、HTML要素の一意のIDを指定します（値はHTMLドキュメント内で一意である必要があります）。
このid属性は、スタイルシート内のスタイルを指すために最もよく使用され、JavaScript（HTML DOMを介して）によって特定のIDを持つ要素を操作するために使用されます。
ブラウザのサポート
| Attribute | |||||
|---|---|---|---|---|---|
| id | Yes | Yes | Yes | Yes | Yes |
構文
<element id="id">
属性値
| Value | Description |
|---|---|
| id | Specifies a unique id for the element.
Naming rules:
|
その他の例
例1
id属性を使用して、ページ内で指定されたIDを持つ要素にリンクします。
<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>
例2
id属性を使用して、CSSでテキストのスタイルを設定します。
<html>
<head>
<style>
#myHeader {
color: red;
text-align: center;
}
</style>
</head>
<body>
<h1 id="myHeader">W3Schools is the best!</h1>
</body>
</html>
関連ページ
HTMLチュートリアル：HTML ID
HTMLチュートリアル：HTML属性
CSSチュートリアル：CSS構文
CSSリファレンス：CSS #id Selector
HTML DOMリファレンス：HTML DOM getElementById（）メソッド
HTML DOMリファレンス：HTML DOMidプロパティ
HTML DOMリファレンス：HTMLDOMスタイルオブジェクト