$(window).scrollTop()対$(document).scrollTop()


回答:


149

どちらも同じ効果がありますます。

しかし、コメントで指摘したように:$(window).scrollTop()より多くのWebブラウザでサポートされてより$('html').scrollTop()


3
IE8で0を返します(ただし、私のページはquirksモードですが、これが要因になる場合があります)
Greg Ogle

38
$( 'html')。scrollTop()はクロスブラウザではありません(セッターとしては、少なくともChromeでは機能しません)。現在のところ、これを行う最もクロスブラウザな方法は、ゲッターとしての$(window).scrollTop()、セッターとしての$( 'html、body')。scrollTop(offset)です。
Georgii Ivankin 2013年

6
このリファレンスによると、引数なしでscrollTopはどこにもスクロールせず、現在のスクロール位置を返すだけです。
またはMapper 2013

3
@ d2burke scrollTop()はゲッターでscrollTop(value)あり、セッターです。scrollTop()引数がない場合、スクロール位置は変わりません。

1
@ M98 window.scrollTo(x、y)
ボッドマン2017

36

まず、との違いを理解する必要がwindowありdocumentます。windowオブジェクトは、トップレベルのクライアント側のオブジェクトです。windowオブジェクトの上には何もありません。JavaScriptはオブジェクト指向言語です。オブジェクトから始めて、そのプロパティまたはオブジェクトグループのプロパティにメソッドを適用します。たとえば、documentオブジェクトはオブジェクトのwindowオブジェクトです。documentの背景色を変更するには、documentbgcolorプロパティを設定します。

window.document.bgcolor = "red" 

あなたの質問に答えるために、windowとの最終結果に違いはありませんdocument scrollTop。どちらも同じ出力になります。

動作例を確認する http://jsfiddle.net/7VRvj/6/で

一般的な使用ではdocument、主にイベントを登録して使用するwindowような事をするscrollscrollTopresize


最終結果に違いはありません。どちらも同じ出力になります。
フセイン

見かけ上、ウィンドウオブジェクトがオーバーフローしているオブジェクトではない可能性があるため、一部のブラウザはウィンドウスクロールをサポートしていません。
Bodman

11
どのブラウザがウィンドウをサポートしていないか、具体的に。次にjsfiddle.net/7VRvj/4の例を 示します。すべてのブラウザで確認し、動作していないブラウザを教えてください。
フセイン


0

私は同様の問題をいくつか抱えています scrollTopここ説明しました。

最後に、セレクターを使用してFirefoxIEでこれを回避しました$('*').scrollTop(0);

影響を与えたくない要素がある場合は完璧ではありませんが、ドキュメント、ボディ、HTML、ウィンドウの差異を回避できます。それが役立つ場合...


20
この方法を*使用してはなりません(実際、*完全に避けます)。1つの要素をターゲットにする代わりに、DOM全体に影響を与えます。巨大なパフォーマンスヒット。セレクターはできるだけ正確でなければなりません。
Vlad

2
私は常に個人的に使用してき$("html,body").scrollTop(val)ました
Roi
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.