id 属性 （HTMLグローバル属性）

HTMLのid属性の説明です。id属性は、要素を一意に識別するIDを定義する属性です。

---

目次

1. 属性の記述例
   • 閲覧中ブラウザーでの表示結果
2. 属性の説明
3. 利用可能な属性値

属性の記述例

<button id="button1">ボタン1</button>
<button id="button2">ボタン2</button>
<button id="button3">ボタン3</button>

document.getElementById("button1").onclick = function () {
  alert("ボタン1がクリックされました。")
};
document.getElementById("button2").onclick = function () {
  alert("ボタン2がクリックされました。")
};
document.getElementById("button3").onclick = function () {
  alert("ボタン3がクリックされました。")
};

#button1 {
  background: pink;
}
#button2 {
  background: yellow;
}
#button3 {
  background: skyblue;
}

 

閲覧中ブラウザーでの表示結果

 

属性の説明

• id属性は、要素を一意に識別するIDを定義する属性です。
• id属性は、グローバル属性であるため、すべての要素で利用することができます。
• id属性は、JavaScriptで要素を一意に指定するときによく利用されます。
• id属性は、CSSで要素を一意に指定するときによく利用されます。

 

利用可能な属性値

属性値	属性値の説明
ID値	ID値は、以下の４つのルールを満たす値である必要があります。 同ファイル内で一意の値であること。 大文字小文字は区別されない。 最低でも一文字以上であること。 空白文字を含むことはできない。