这是对我有用的jQuery解决方案。clientWidth等没有工作。

function is_overflowing(element, extra_width) {
    return element.position().left + element.width() + extra_width > element.parent().width();
}

如果这不起作用，请确保元素的父元素具有所需的宽度(就个人而言，我必须使用parent().parent())。位置相对于父节点。我还包含了extra_width，因为我的元素(“标签”)包含的图像需要很短的时间来加载，但在函数调用期间，它们的宽度为零，破坏了计算。为了解决这个问题，我使用下面的调用代码:

var extra_width = 0;
$(".tag:visible").each(function() {
    if (!$(this).find("img:visible").width()) {
        // tag image might not be visible at this point,
        // so we add its future width to the overflow calculation
        // the goal is to hide tags that do not fit one line
        extra_width += 28;
    }
    if (is_overflowing($(this), extra_width)) {
        $(this).hide();
    }
});

希望这能有所帮助。

jquery的替代答案是使用[0]键来访问原始元素，如:

if ($('#elem')[0].scrollHeight > $('#elem')[0].clientHeight){

出于封装原因，我扩展了Element。从微观回答。

/*
 * isOverflowing
 * 
 * Checks to see if the element has overflowing content
 * 
 * @returns {}
 */
Element.prototype.isOverflowing = function(){
    return this.scrollHeight > this.clientHeight || this.scrollWidth > this.clientWidth;
}

像这样使用它

let elementInQuestion = document.getElementById("id_selector");

    if(elementInQuestion.isOverflowing()){
        // do something
    }

这是对我有用的jQuery解决方案。clientWidth等没有工作。

function is_overflowing(element, extra_width) {
    return element.position().left + element.width() + extra_width > element.parent().width();
}

如果这不起作用，请确保元素的父元素具有所需的宽度(就个人而言，我必须使用parent().parent())。位置相对于父节点。我还包含了extra_width，因为我的元素(“标签”)包含的图像需要很短的时间来加载，但在函数调用期间，它们的宽度为零，破坏了计算。为了解决这个问题，我使用下面的调用代码:

var extra_width = 0;
$(".tag:visible").each(function() {
    if (!$(this).find("img:visible").width()) {
        // tag image might not be visible at this point,
        // so we add its future width to the overflow calculation
        // the goal is to hide tags that do not fit one line
        extra_width += 28;
    }
    if (is_overflowing($(this), extra_width)) {
        $(this).hide();
    }
});

希望这能有所帮助。

比较元素。scrollHeight到元素。clientHeight应该做这个任务。

下面是来自MDN解释Element的图片。scrollHeight和Element.clientHeight。

为条件可见性添加一个事件监听器:

document.getElementById('parent').addEventListener('scroll', (e) => {
  const childEl = document.getElementById('child');

  childEl.style.visibility = e.target.scrollTop > 0 ? 'visible' : 'hidden';
});