加载 HTML 文件时浏览器跳转到页面中间 [英] Browser jumps to middle of page when loading HTML file

问题描述

当我在 Chrome 中打开一个 HTML 文件时，页面加载了一些随机 h3 标签从文档中间的窗口顶部(见下面代码中的最后一个 h3 标签)，而不是页面的实际顶部.该点以上的所有内容都是加载的，但我必须向上滚动才能到达顶部.

When I open an HTML file in Chrome, the page loads with some random h3 tag from the middle of the document (see last h3 tag in code below) at the top of the window, instead of the actual top of the page. All of the content above that point is loads, but I have to scroll up to get to the top.

当我使用 Firefox 时也会发生同样的事情，尽管它在窗口顶部的示例中加载了第一个 h3 标签.Safari 在顶部加载了这是一个粗体文本示例"段落.知道为什么会发生这种情况吗?

Same thing happens when I use Firefox, although it loads with the first h3 tag in my example at the top of the window. Safari loads with the "Here is an example of bold text" paragraph at the top. Any idea why this might be happening?

<h3>Audio</h3>
<audio src="07 Wake Up.mp3" controls>Here is some audio</audio>

<p>
<a href="#top">Back to top</a>
</p>

<hr />

<h3 id="B">Bold text</h3>
<p>Here is an example of <b>bold text</b></p>

<h3>Bi-directional override</h3>

<p><bdo dir="rtl">This text will go from right to left.</bdo></p>
<p><bdo dir="rtl">.tfel ot thgir morf og lliw txet sihT</bdo></p>

<h3>Blockquotes</h3>

<p>Blockquotes specify a section that is quoted from another source, like in the passage below:</p>
<blockquote cite="http://www.archives.gov/exhibits/charters/declaration_transcript.html">We hold these truths to be self-evident, that all men are created equal, that they are endowed by their Creator with certain unalienable Rights, that among these are Life, Liberty and the pursuit of Happiness.</blockquote>

<h3 id="button">Buttons</h3>

推荐答案

我想我知道现在发生了什么.问题不在于页面顶部加载的标签，而是出现在几行下方的自动对焦按钮:

I think I know what's going on now. The issue isn't with the tags that are loading at the top of the page, but with an autofocus button that appears a few lines down:

<h4>Autofocus button</h4>
<button type="button" autofocus>Autofocus button</button>

对于任何玩弄自动对焦按钮的人来说，似乎它们会导致浏览器在加载时在该点上自动对焦"(废话).在我的原始案例中，我的页面加载了窗口底部的自动对焦按钮，一些标题来自顶部的几行，而页面的实际顶部无处可见.

For anyone playing around with autofocus buttons, it seems like they cause the browser to "autofocus" (duh) on that point upon loading. In my original case, my page loaded with the autofocus button on the bottom of the window, some headings from a few lines up at the top, and the actual top of the page nowhere in sight.

这篇关于加载 HTML 文件时浏览器跳转到页面中间的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！