デモを使用して、これら3つのプロパティの違いをテストします。
説明:
scrollwidth:オブジェクトの実際のコンテンツの幅、エッジのない線の幅は、オブジェクトのコンテンツが表示領域を超えると大きくなります。
clientWidth:スクロールバーの均一ラインを包むことなく、オブジェクトコンテンツの表示エリアの幅は、オブジェクトの表示サイズが変更されると変更されます。
OffsetWidth:オブジェクト全体の実際の幅は、スクロールバーが等しく縁取られており、オブジェクトがサイズを表示すると変更されます。
デモはページにTextArea要素を配置し、デフォルトの幅と高さで表示します。
状況1:
要素にコンテンツがない場合、またはコンテンツが表示領域を超えない場合、スクロールが表示されないか、使用できません。
scrollwidth = clientWidth、どちらもコンテンツビューイング領域の幅です。
offsetWidthは、要素の実際の幅です。
状況2:
要素のコンテンツは表示エリアを超え、スクロールバーが表示され、利用可能です。
scrollwidth> clientWidth。
ScrollWidthは、実際のコンテンツの幅です。
ClientWidthは、コンテンツ表示エリアの幅です。
offsetWidthは、要素の実際の幅です。
終わり
上記は、ScrollWidth、ClientWidth、およびOffsetWidthのすべての違いです。私はそれが誰にでも役立つことを願っています。