Javascript 检查元素在屏幕上是否真实可见

有没有办法检查DOM元素在屏幕上是否真的可见

意思是：

• 其未隐藏（例如：显示：无，可见性：隐藏）
• 它没有被另一个元素隐藏
• 其不透明度不是0，其父对象的不透明度也不是0

（这些是我能想到的案例）

这就是我目前得到的

function isVisible(el) {
    //is hidden (display, visibility)
    var isHidden = el.style.display == 'none' || ['collapse', 'hidden'].indexOf(el.style.visibility) == -1;
    if(isHidden)
        return false;

    //is hidden by another element
    el.scrollIntoView();
    var rect = el.getBoundingClientRect();
    var targetAtPos = document.elementFromPoint(rect.left, rect.top);
    var isHiddenByAnother = targetAtPos != el;
    if(isHiddenByAnother)
        return false;

    //Check opacity
}

---

虽然它可能是重复的，OP清楚地说明了这个问题，并显示了在寻找解决方案方面的努力。所有的反对票是怎么回事？可能是@Clive的重复你发布的问题不包括我问题中的第二和第三种情况，而是-阅读你所指的所有答案？虽然可能是重复的，但OP清楚地陈述了问题，并显示出在寻找解决方案方面的努力。所有的反对票是怎么回事？可能是@Clive的重复你发布的问题不包括我问题中的第二和第三个案例，而是-阅读你所指的所有答案？