jQuery

[jQuery] 要素の横幅と高さを取得する

投稿日:2017年10月1日 更新日:

要素の横幅と高さを取得するには、outerWidth/outerHeightinnerWidth/innerHeightを使用します。

サンプルソース

例)hogeをクリックすると要素のサイズを表示する

結果例

150x100のDIVで、枠線の太さが10pxです。

hoge
(結果)
160x110、150x100

1つ目の値はouter値、2つ目の値はinner値です。

解説

  • outerWidth、outerHeightはborderサイズを含むサイズを返します。
  • innerWidth、innerHeightはborderサイズを含まないサイズを返します。
  • outerWidthとouterHeightは引数にtrueを渡すと、marginを含んだ値が返ります。
    例)outerWidth(true);

スポンサーリンク

スポンサーリンク

-jQuery
-

執筆者:


comment

メールアドレスが公開されることはありません。 * が付いている欄は必須項目です

関連記事

[jQuery] 要素内の末尾にタグを追加する(.append)

要素の後にタグを追加するには、appendを使用します。 サンプル 例)ボタンを押すと、要素の後にxyzを追加する [c ...

[jQuery] インデックス指定で子要素を取得する(.eq)

インデックス指定で子要素を取得するには、.eq()を使用します。 サンプルソース 例)3番目の子要素を取得する [cra ...

[jQuery] バインドされたイベントを削除する(.unbind)

指定した要素にバインドされたイベントを削除するには、.unbindを使用します。 サンプルソース 例)ボタンを押すとバイ ...

[jQuery] マウスオーバーで画像を切り替える

jQueryでマウスオーバーで画像を切り替えるサンプルです。 サンプルソース 例)画像にカーソルを当てると画像が切り替わ ...

[jQuery] XML文字列をXMLドキュメントに変換する($.parseXML)

XML文字列をXMLドキュメントに変換するには、$.parseXML()を使用します。 サンプルソース 例)XML文字列 ...

スポンサーリンク