JavaScript はどのようにして要素のオーバーフローを検出できるのでしょうか?

JavaScript による要素のオーバーフローの検出

要素のコンテンツが指定されたスペースを超えているかどうかを判断するために、JavaScript は便利なアプローチを提供します。 isOverflown() 関数は、要素に垂直方向、水平方向、またはその両方のオーバーフローがあるかどうかを確認するように設計されています。

この関数を利用するには、対象の要素を引数として渡すだけで、ブール値が返されます。オーバーフローしたかどうかを示します。

function isOverflown(element) {
  return element.scrollHeight > element.clientHeight || element.scrollWidth > element.clientWidth;
}

これを適用する方法は次のとおりです。 function:

var els = document.getElementsByClassName('demos');
for (var i = 0; i < els.length; i++) {
  var el = els[i];
  el.style.borderColor = (isOverflown(el) ? 'red' : 'green');
  console.log("Element #" + i + " is " + (isOverflown(el) ? '' : 'not ') + "overflown.");
}

この例では、「demos」クラスを使用してすべての要素を反復処理し、各要素がオーバーフローしたかどうかを確認し、オーバーフローに応じて、対応するメッセージを赤または緑の枠線で表示します。ステータス。

以上がJavaScript はどのようにして要素のオーバーフローを検出できるのでしょうか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。