javascript 为什么不推荐使用 body.scrollTop?

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/19635188/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-27 16:16:50  来源:igfitidea点击:

Why is body.scrollTop deprecated?

javascriptscrolltopstrict-mode

提问by Himanshu P

It seems body.scrollTop(and body.scrollLeft) are deprecated in ES5 strict-mode. What is the reason for this, given that it still seems okay to use these properties on other DOMElements?

似乎body.scrollTop(和body.scrollLeft)在 ES5 严格模式中已被弃用。鉴于在其他DOMElements上使用这些属性似乎仍然可以,这是什么原因?

Background Info:

背景资料:

I have a function that tries to increase (or decrease, as specified) the scrollTopvalues of all the ancestors of an element, till one of these actually changes. I am wondering if, to stay complaint with strict-mode, I should specifically check against the bodyelement as the chain of parents moves upward.

我有一个函数试图增加(或减少,如指定)scrollTopan 的所有祖先的值element,直到其中一个实际发生变化。我想知道,为了保持对严格模式的抱怨,我是否应该body在父链向上移动时专门检查元素。

[Obviously, bodyrefers to document.body]

[显然,body指的是document.body]

回答by sam

It's Chrome's own incorrect behavior that is deprecated, and they're warning authors to stop relying on it.

不推荐使用 Chrome 自身的错误行为,他们警告作者停止依赖它。

The scrolling viewport is represented by document.documentElement(<html>) in standards mode or <body>in quirks mode. (Quirks modeemulates the document rendering of Navigator 4 and Explorer 5.)

在标准模式或quirks 模式下滚动视口由document.documentElement( <html>)表示<body>。(Quirks 模式模拟 Navigator 4 和 Explorer 5 的文档呈现。)

Chrome uses body.scrollTopto represent the viewport's scroll position in bothmodes, which is wrong. It sounds like they want to fix thisso they're encouraging authors to script for the standard behavior.

Chromebody.scrollTop两种模式下使用来表示视口的滚动位置,这是错误的。听起来他们想要解决这个问题,所以他们鼓励作者为标准行为编写脚本。

I don't think you need to change your code. There's nothing wrong with using body.scrollTopin standards mode so long as you understand it represents the scroll position of bodyonly (typically 0, unless you've given bodya scroll box).

我认为您不需要更改代码。body.scrollTop在标准模式下使用没有任何问题,只要您理解它body仅代表 的滚动位置(通常为0,除非您提供body了滚动框)。

You can see the warning by executing document.body.scrollTopin the console:

您可以通过document.body.scrollTop在控制台中执行来查看警告:

body.scrollTopis deprecated in strict mode. Please use documentElement.scrollTopif in strict mode and body.scrollToponly if in quirks mode.

body.scrollTop在严格模式下被弃用。请documentElement.scrollTop在严格模式下使用,并且body.scrollTop仅在 quirks 模式下使用。

回答by Adrian

I noticed my code stop working on newer versions of Chrome. I fixed it by using window.scrollY

我注意到我的代码在较新版本的 Chrome 上停止工作。我通过使用修复它window.scrollY

Before:

前:

var scrollTop = document.body.scrollTop;

Now:

现在:

var scrollTop = window.scrollY;

It works all the time now. You can find more documentation here.

它现在一直有效。您可以在此处找到更多文档。

Also, I was using:

另外,我正在使用:

document.body.scrollTop = 0;

now I replaced it with:

现在我将其替换为:

window.scrollTo(0, 0);

回答by Marvin Brouwer

scrollTop refers to how much the element is scrolled. This means body shouldn't have a scrollTop because it is never scrolled, body has the topmost scrollbar so it's contents can be scrolled but not body itself.
The last picture on this page explains a lot:
https://developer.mozilla.org/en-US/docs/Web/API/Element.scrollTop

scrollTop 指的是元素滚动了多少。这意味着 body 不应该有 scrollTop 因为它从不滚动,body 有最顶部的滚动条,所以它的内容可以滚动但不是 body 本身。
本页最后一张图片说明了很多:https:
//developer.mozilla.org/en-US/docs/Web/API/Element.scrollTop