我正在处理一个使用监听器的网站,用于显示和隐藏内容DIV并滚动到相同名称的命名锚点。
我遇到了一个奇怪的问题,它不是滚动到锚点,而是滚动到ID与锚点名称相同的DIV。
一旦我将DIV ID更改为不同的名称,行为就符合预期了。
我似乎找不到任何关于此的文档,想知道这是否是记录下来的行为。
可行代码:
<a name="top">top</a>
<p id="bottomx" style="height: 1800px;">
<a href="#top">top</a>
<a href="#bottom">bottom</a>
<br>
</p>
<a name="bottom">bottom</a>
未达到预期效果:
<a name="top">top</a>
<p id="bottom" style="height: 1800px;">
<a href="#top">top</a>
<a href="#bottom">bottom</a>
<br>
</p>
<a name="bottom">bottom</a>
在第二个示例中,它将滚动到名为“bottom”的P。同样,如果我在页面底部创建一个ID为“bottom”的DIV,并且我点击page.html#bottom,它会滚动到该DIV。
这似乎很令人困惑。有没有想法为什么会以这种方式工作?Safari和FF的行为相同。
id
和name
属性共享相同的命名空间。这意味着它们不能同时在同一文档中定义具有相同名称的锚点。” 我认为在HTML5规范中重新定义了这一点,以考虑浏览器实现的常见行为。 - Felix Kling