HTMLタグにhiddenを付けて非表示に
HTML内で非表示にしたい箇所があるときはCSSでdisplay:noneを指定したりJavaScriptを使用する方法などがあるがタグにhidden属性を付けるやり方も存在する。
例えば現在以下のコードがこの下の部分に記述されているがhidden属性が追加されているため非表示になっている。
※hiddenが付いていなければ↓ここにhoge, fugaが表示される。
hoge
fuga
<div style="padding: 10px; background: #eee;"> <a hidden href="#">hoge</a> <p hidden>fuga</p> </div>
JavaScriptでhiddenを追加するにはsetAttributeで下記のように指定する。
var s = document.querySelector('.site-branding'); s.setAttribute('hidden', '');