hidden属性とは
hidden属性は、現在その要素が関連性が無いことを示す属性です。この属性を使うとその要素は非表示になりますが、非表示にすることを目的とした属性ではありません。従って、タブ付きメニュー等で、非表示のコンテンツに利用するような使い方は誤りになります。
- 属性値
- "hidden": 関連性が無いことを示す
- 利用できるバージョン(HTML4.01以降)
- HTML5 〜
- 対応ブラウザ
-
- Chrome
- Firefox
- Internet Explorer11 〜
- Opera
- Safari
hidden属性を使ったサンプル
<form action="">
<label>
<input type="checkbox" name="question" id="other" value="other" onchange="toggle()">その他
</label>
<label id="other_text" hidden>
<input type="text" name="question" id="other_text" value="">
</label>
</from>
function toggle() {
var radio = document.getElementById("other");
var text = document.getElementById("other_text");
if (radio.checked) {
text.removeAttribute("hidden");
} else {
text.setAttribute("hidden", "hidden");
}
}
RERUN
仕様
- HTML5.1
- 5.1. The hidden attribute
- HTML5
- 7.1 The hidden attribute