Javascript 溢出检查不工作

在这种情况下，我希望

checkOverflow

函数返回

true

HTML:

知道函数的

console.log

为什么在这里返回

true

吗？

问题是

#txt

向右浮动，所以向左溢出

但是使用默认的从左到右的方向，不可能向左滚动

但是，如果使用从右向左的方向，则可以

#z{方向：rtl；}

功能检查溢出（el）{
var curOverflow=el.style.overflow；
如果（！curOverflow | | curOverflow==‘可见’）
el.style.overflow='hidden'；
var isoverflow=el.clientWidth
div#z{
位置：相对位置；
背景：红色；
宽度：50px；
高度：50px；
溢出：自动；
方向：rtl；
}
div#txt{
背景：浅蓝色；
浮动：对；
}

345345345345345345345345345345345
这是我的解决方案


问题是它不是内联元素，如果您更改为span标记，它就会工作

我也改变了这个

el.offsetWidth //instead of clientWidth

scrollHeight
和
scrollWidth
对应于实际的
clientHeight
和
clientwidth
+隐藏的高度或宽度。由于
div#txt
向右浮动，因此不会溢出

您还应该查看和。
这只“起作用”，因为选择器
div#txt
不再适用，然后它不再向右浮动。如果再次放置浮动，它将再次起作用，因为标记更改为。检查一下！看小提琴：。所以在这种情况下你错了。对于内联元素，这非常有效任何答案都能回答您的问题？
console.log(checkOverflow(document.getElementById('z')));

function checkOverflow(el) {

  var curOverflow = el.style.overflow;

  if (!curOverflow || curOverflow === 'visible')
    el.style.overflow = 'hidden';

  var isOverflowing = el.clientWidth < el.scrollWidth || el.clientHeight < el.scrollHeight;

  el.style.overflow = curOverflow;

  return isOverflowing;
};

div#z {
  position: relative;
  background: red;
  width: 50px;
  height: 50px;
  overflow: auto;
}

div#txt {
  background: lightblue;
  float: right;
}

el.offsetWidth //instead of clientWidth