我在阅读两个 CSS 属性 display:none
和 visibility:hidden
之间的区别时遇到了 DOM reflow 术语。
声明是
display: none
causes a DOM reflow whereasvisibility: hidden
does not.
所以我的问题是:
什么是 DOM 重排及其工作原理?
最佳答案
A reflow computes the layout of the page. A reflow on an element recomputes the dimensions and position of the element, and it also triggers further reflows on that element’s children, ancestors and elements that appear after it in the DOM. Then it calls a final repaint. Reflowing is very expensive, but unfortunately it can be triggered easily.
Reflow occurs when you:
- insert, remove or update an element in the DOM
- modify content on the page, e.g. the text in an input box
- move a DOM element
- animate a DOM element
- take measurements of an element such as offsetHeight or getComputedStyle
- change a CSS style
- change the className of an element
- add or remove a stylesheet
- resize the window
- scroll
更多信息请引用:Repaints and Reflows: Manipulating the DOM responsibly
关于html - 什么是 DOM 回流?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/27637184/