display: none；和visibility:hidden;的区别

display: none；不为被隐藏的对象保留其物理空间；

visibility:hidden;所占据的空间位置仍然存在,仅为视觉上的完全透明；

display: none和visibility:hidden的区别就是visibility:hidden会保留元素的空间，而display: none不保留元素空间。

repaint(重绘) ，repaint发生更改时，元素的外观被改变，且在没有改变布局的情况下发生，如改变outline,visibility,background color，不会影响到dom结构渲染。

reflow(渲染)，与repaint区别就是他会影响到dom的结构渲染，同时他会触发repaint，他会改变他本身与所有父辈元素(祖先)，这种开销是非常昂贵的，导致性能下降是必然的，页面元素越多效果越明显。

所以display:none才会产生reflow

visibility:hidden只会出发repaint