ページ要素の値を取得する方法と Js と Jq の違いの比較_jquery

JSとJqueryはどちらもページ要素の幅、高さ、相対移動を取得できますが、相互に変換したり置き換えたりすることはできますか? 書き方の違いは何ですか?この記事では詳しく紹介していきます。

1.Js はブラウザの高さと幅を取得します

document.documentElement.clientWidth ==> ブラウザの表示領域の幅
document.documentElement.clientHeight ==> ブラウザの表示領域の高さ
document.body.clientWidth ==> BODY オブジェクトの幅
document.body.clientHeight ==> BODY オブジェクトの高さ

Jq はブラウザの高さと幅を取得します

$(window).width() ==> ブラウザの表示領域の幅
$(window).height() ==> ブラウザの表示領域の高さ
$(document).height() ==> ページドキュメントの高さ
$(document.body).height() ==> BODY オブジェクトの高さ

2.Js はオブジェクトの高さと幅を取得します

obj.width = obj.style.width
obj.clientWidth = width padding ==> 内側の境界線（パディング）を含む要素の幅を取得します
obj.offsetHeight = height padding border ==> 内側のボーダー（パディング）とボーダー（ボーダー）を含む要素の高さを取得します

Jq はオブジェクトの高さと幅を取得します

obj.innerWidth() ==> 内側の境界線 (パディング) を含む要素の幅を取得します。 obj.outerWidth() ==> 内側の境界（パディング）と境界（ボーダー）を含む要素の幅を取得します
obj.outerWidth(true) ==> 外枠（マージン）を含めた要素の幅を取得します
同じ要素 w は次のようにする必要があります: width() obj.scrollWidth ==> オブジェクトのスクロール幅を取得します
obj.scrollHeight ==> オブジェクトのスクロール高さを取得します
obj.scrollLeft ==> オブジェクトの左端のスクロール距離を設定または取得します
obj.scrollTop ==> オブジェクトの上部のスクロール距離を設定または取得します

Jq はオブジェクトの相対的な高さと幅を取得します

obj.offset().top ==> 要素はドキュメントの先頭
を基準としています。 obj.scrollLeft() ==> スクロール バーの左側を基準としたオブジェクトのオフセットを設定または返します。
obj.scrollTop() ==> スクロール バーの上部を基準としたオブジェクトのオフセットを設定または返します。