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

HTMLのhidden属性の説明です。hidden属性は、要素がまだない、もしくはもはや関連性がないことを定義する論理型属性です。

---

目次

1. 属性の記述例
   • 閲覧中ブラウザーでの表示結果
2. 属性の説明

属性の記述例

<p>
  <label for="login" id="label">ログインしてください。</label>
  <input type="button" id="login" value="ログイン">
</p>
<div id="text" hidden>ログインしました。</section>

document.getElementById("login").onclick = function () {
  document.getElementById('login').hidden = true;
  document.getElementById('label').hidden = true;
  document.getElementById('text').hidden = false;
}

 

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

 

属性の説明

• hidden属性は、要素がまだない、もしくはもはや関連性がないことを定義する属性です。
• hidden属性は、論理型属性です。
• hidden属性は、グローバル属性であるため、すべての要素で利用することができます。
• hidden属性は、（ボタンの押下などの）条件が満たされるまで、ユーザに要素の中身が見られるのを防ぐ用途で利用できます。