hidden、display: none、visibility: hidden、opacity=0
這幾種方法都可以隱藏頁面元素，但是hidden是html屬性，其余三種是樣式，另外它們還有以下區(qū)別：
hidden
hidden是html5新增加的屬性，具體用法如下：
<p hidden="hidden">這是一段隱藏的段落。</p>
hidden屬性實際上是為元素添加了display: none 樣式。
display: none;
- 瀏覽器不會生成屬性為display: none;的元素。
- display: none 不占據(jù)空間（不渲染所以不占空間），所以動態(tài)改變此屬性時會引起重排。
- display: none 不會被子類繼承，但是子類也不會顯示。
visibility: hidden;
- 元素會被隱藏，但是不會消失，依然占據(jù)空間。
- visibility: hidden 會被子類繼承，子類也可以通過顯示的設置visibility: visible;來反隱藏。
- visibility: hidden 不會觸發(fā)該元素已經(jīng)綁定的事件。
- visibility: hidden 動態(tài)修改此屬性會引起重繪。
opacity=0
- opacity=0 只是透明度為100%，元素隱藏，依然占據(jù)空間。
- opacity=0 會被子元素繼承，但子元素并不能通過opacity=1，進行反隱藏。
- opacity=0 的元素依然能觸發(fā)已經(jīng)綁定的事件。
