ホームページ  >  記事  >  ウェブフロントエンド  >  ページ要素の値を取得する方法と Js と Jq の違いの比較_jquery

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

WBOY
WBOYオリジナル
2016-05-16 16:01:471057ブラウズ

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().left ==> 要素はドキュメントの左側を基準にしています

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

以上がこの記事の全内容です。皆さんに気に入っていただければ幸いです。

声明:
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。