判断元素不可见几种方法
offsetParent
优点:快,
缺点:不准确,比如fixed时
const result = el.offsetParent == null
getComputedStyle
优点:精确,
缺点:效率低,需逐层往上遍历
const result = (function() {
while(el.nodeName.toLowerCase() != 'body') {
if( el.style.display == 'none' || window.getComputedStyle(el).display == 'none') {
return true
} else {
el = el.parentNode
}
}
return false
})()
getBoundingClientRect
优点:稍快,
缺点:不准确
const result = (function () {
const rect = el.getBoundingClientRect()
return (rect.width && rect.height) == 0
})()
控制台察看耗时对比