js实现网页锚点跳转，谷歌和火狐浏览器均适用

最新推荐文章于 2022-10-25 17:24:49 发布

正宗六脉神剑

最新推荐文章于 2022-10-25 17:24:49 发布

阅读量815

点赞数 2

CC 4.0 BY-SA版权

分类专栏： web 文章标签：网页锚点浏览器跳转 js

本文链接：https://blog.youkuaiyun.com/weixin_43837883/article/details/105009014

本文介绍如何使用JavaScript解决在谷歌和火狐等浏览器中实现网页锚点跳转的问题。传统的a标签name属性在某些浏览器可能无法正常工作，通过JS代码可以实现兼容性更好的跳转效果。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

想做一个文档目录，需要添加锚点，点击跳转到指定位置。我开始使用a标签的name 属性，发现只能在火狐浏览器跳转，在谷歌浏览器里点了没有任何反应。尝试了几次都失败，最后用下面的js，完美适用。
下面是示例代码：
目录部分

<ul>
      <li><strong>目录</strong></li>
	  <li><a href="javascript:void(0);" οnclick="naver('A')">前言</a></li>
      <li><a href="javascript:void(0);" οnclick="naver('B')">介绍</a></li>
</ul>

内容部分

<div  id="A"></div>
      <p> 在本WordPress教程中，您将找到使用WordPress创建网站所需的一切。从安装到备份–几乎涵盖了所有内容。</p>
      .
      .
      .
<div  id="B"></div>
      <p> 在本WordPress教程中，您将找到使用WordPress创建网站所需的一切。从安装到备份–几乎涵盖了所有内容。</p>

还有下面这段代码别忘了加在