在Web开发中，DOM（文档对象模型）是一个非常重要的概念，它提供了一种方式来访问和操作HTML、XHTML和XML文档的结构，检测DOM元素的可见性是Web开发中的一个常见需求，你可能想要知道一个元素是否在视窗中，或者一个元素是否被其他元素遮挡，为了解决这个问题，有一些高级抽象层可以帮助我们进行DOM元素的可见性检测。

1. 使用getComputedStyle()方法

getComputedStyle()是一个JavaScript方法，它可以获取到元素的所有CSS属性值，包括那些由于继承或者默认样式而改变的属性值，我们可以利用这个方法来检测一个元素是否可见。

function isElementVisible(el) {
    var style = window.getComputedStyle(el);
    return style.display !== 'none' && style.visibility !== 'hidden' && style.opacity !== '0';
}

这个方法的工作原理是检查元素的display、visibility和opacity属性，如果这些属性的值都不是"none"、"hidden"或者"0"，那么我们就可以认为这个元素是可见的。

2. 使用Intersection Observer API

Intersection Observer API是一个浏览器提供的API，它可以让我们异步地观察一个元素是否进入了视窗或者离开了视窗，这个API非常适合用来检测一个元素是否可见。

var observer = new IntersectionObserver(function(entries, observer) {
    entries.forEach(function(entry) {
        if (entry.isIntersecting) {
            console.log('Element is visible');
        } else {
            console.log('Element is not visible');
        }
    });
}, { threshold: [0] });
observer.observe(document.querySelector('#myElement'));

在这个例子中，我们首先创建了一个新的Intersection Observer实例，我们提供了一个回调函数，这个函数会在每次观察到元素状态改变时被调用，在这个回调函数中，我们检查isIntersecting属性，如果它的值为true，那么元素就是可见的；否则，元素就是不可见的，我们使用observe()方法来开始观察一个元素。

3. 使用scrollIntoView()方法

scrollIntoView()是一个JavaScript方法，它可以让一个元素滚动到视窗中，我们可以利用这个方法来检测一个元素是否可见。

function isElementVisible(el) {
    var rect = el.getBoundingClientRect();
    return (rect.top >= 0 && rect.left >= 0 && rect.bottom <= (window.innerHeight || document.documentElement.clientHeight) && rect.right <= (window.innerWidth || document.documentElement.clientWidth));
}

这个方法的工作原理是获取元素的位置信息，然后检查这个位置信息是否在视窗的范围内，如果在范围内，那么元素就是可见的；否则，元素就是不可见的。

以上就是一些用于检测DOM元素可见性的高级抽象层，每种方法都有其优点和缺点，你可以根据你的具体需求来选择最适合你的方法。