$ (Fenster) .scrollTop () vs. $ (Dokument) .scrollTop ()

Antworten:

149

Sie werden beide den gleichen Effekt haben .

Wie in den Kommentaren erwähnt, $(window).scrollTop()wird jedoch von mehr Webbrowsern als unterstützt $('html').scrollTop().

Bodman
quelle
3
es gibt 0 in IE8 zurück (obwohl meine Seite im Mackenmodus ist, der einen Faktor spielen kann)
Greg Ogle
38
$ ('html'). scrollTop () ist nicht browserübergreifend (als Setter funktioniert es zumindest in Chrome nicht). Die derzeit am besten geeignete Methode ist: $ (Fenster) .scrollTop () als Getter, $ ('html, body'). ScrollTop (Offset) als Setter.
Georgii Ivankin
6
Laut dieser Referenz wird ohne Argumente scrollTopnirgendwo gescrollt, sondern nur die aktuelle Bildlaufposition zurückgegeben.
ODER Mapper
3
@ d2burke scrollTop()ist ein Getter und scrollTop(value)ist ein Setter. scrollTop()ohne Argumente ändert die Bildlaufposition nicht.
1
@ M98 window.scrollTo (x, y)
Bodman
36

Zunächst müssen Sie den Unterschied zwischen windowund verstehen document. Das windowObjekt ist ein clientseitiges Objekt der obersten Ebene. Über dem windowObjekt befindet sich nichts . JavaScript ist eine objektorientierte Sprache. Sie beginnen mit einem Objekt und wenden Methoden auf seine Eigenschaften oder die Eigenschaften seiner Objektgruppen an. Beispielsweise ist das documentObjekt ein Objekt des windowObjekts. Um die Änderung zu document‚s Hintergrundfarbe, dann würden Sie die eingestellte documents‘ bgcolorEigenschaft.

window.document.bgcolor = "red"

Um Ihre Frage zu beantworten: Es gibt keinen Unterschied im Endergebnis zwischen windowund document scrollTop. Beide geben die gleiche Ausgabe.

Überprüfen Sie das Arbeitsbeispiel unter http://jsfiddle.net/7VRvj/6/

Im Allgemeinen Gebrauch documenthauptsächlich Ereignisse zu registrieren und verwenden windowzu tun , Dinge wie scroll, scrollTop, und resize.

Hussein
quelle
Kein Unterschied im Endergebnis. Beide geben die gleiche Ausgabe.
Hussein
Anscheinend unterstützen einige Browser das Scrollen von Fenstern nicht, da das Fensterobjekt möglicherweise nicht das überlaufende Objekt ist.
Bodman
11
Welcher Browser Fenster nicht unterstützt, sei genau. Hier ist ein Beispiel jsfiddle.net/7VRvj/4 . Überprüfen Sie es in allen Browsern und lassen Sie mich wissen, auf welchem ​​Browser es nicht funktioniert.
Hussein
4

Browserübergreifende Vorgehensweise ist 

var top = ($(window).scrollTop() || $("body").scrollTop());
amachree tamunoemi
quelle
1
Hinweis: $("body").scrollTop()Geben Sie in Google Chrome immer 0 zurück.
Jonathan Parent Lévesque
2
$("body").scrollTop()ist veraltet, funktioniert nicht mehr auf Chrome oder FF . Es wird 0 zurückgeben
Jorge Lazo
0

Ich hatte gerade einige der ähnlichen Probleme mit scrollTop hier beschriebenen .

Am Ende habe ich dies in Firefox und IE mithilfe des Selektors umgangen$('*').scrollTop(0);

Nicht perfekt, wenn Sie Elemente haben, die Sie nicht beeinflussen möchten, aber die Unterschiede zwischen Dokument, Text, HTML und Fenster umgehen. Wenn es hilft ...

Tapiochre
quelle
20
Sie sollten niemals * auf diese Weise verwenden (in der Tat * ganz vermeiden *). Anstatt auf ein Element abzuzielen, wirken Sie sich auf das gesamte DOM aus. Riesiger Leistungshit. Selektoren sollten so präzise wie möglich sein.
Vlad
2
Ich persönlich habe immer $("html,body").scrollTop(val)- hatte nie Probleme
Roi