javascript - 如何检测溢出的 HTML 元素

Question

我创建了一个带有 div 的导航栏。

当我放大时，我通过css [overflow:hidden]隐藏div移出导航栏。

我的目标是创建一个 java 脚本变量，它会告诉我所有 div 都在导航栏之外(由于溢出而隐藏)，因为我需要将它们添加到可折叠菜单中，即使是单个 div 也会出现导航栏。

提前致谢

Answer 1

比较元素的 scrollWidth/scrollHeight 和 clientWidth/clientHeight。

if (e.scrollWidth > e.clientWidth){/*overflow*/}

https://jsfiddle.net/pdrk50a6/

编辑:我不知道你的根元素，但最终它会是这样的。

document.body.onresize = function(){
    var tR = [];
    var tL = document.querySelectorAll('div');

    for(var i=0, j=tL.length; i<j; i++)
        if (tL[i].scrollWidth > tL[i].clientWidth) tR.push(tL[i])

    //Do whatever you need with the tR elements (overflown)
}