便利なjQueryメソッドまとめ

高さ系のメソッド

• outerHeight()：padding、borderまで含んだ高さを取得
• outerHeight(true)：marginまで含んだ高さを取得
• height()：純粋に高さ（height）を取得

(注)

• 該当する要素が複数ある場合、最初の要素
• height()に引数入れたら値をセット出来る（引数なしならgetter、引数ありならsetter）

(例)

• $(window).height()：ブラウザの高さを取得
• $(document).height()：ドキュメント（ページ全体）の高さを取得

座標系のメソッド

• offset()：ドキュメント上での表示位置（ドキュメントベースでの絶対座標）→topとleftの2つを持つ
• scrollTop()：スクロール上での上位置（スクロール範囲の中での座標。相対座標）

よく使うイベント

• scroll
• click
• resize

おまけ

[CSS]positionプロパティ

• static：配置方法を指定しない。これが初期値。
• relative：相対位置への配置。（基準位置の変更。親要素に対して用いる）
• absolute：絶対位置への配置。
  • 親ボックスがstatic→基準はウィンドウの左上
  • 親ボックスがstatic以外→基準は親ボックスの左上
• fixed：絶対位置への配置。（スクロールしても位置固定）
• sticky：対応ブラウザSafari, iOS Safariのみ（2014年7月16日現在）

メソッドチェーン

メリットは、

• $の記述1回で済む
• 処理速度向上