JS锚点的设置与使用方法

2024-05-06 15:45:30

字体：大中小

来源：转载

供稿：网友

锚定通常用于网页，尤其是长网页，这将增加用户体验，本文是错新技术频道小编为大家整理的JS锚点的设置与使用方法，希望对你学习这方面知识有帮助，一起来学习一下吧！

具体如下：

<!DOCTYPE html><html lang="zh-cn"><head><meta charset="UTF-8"><title>锚点</title></head><body><ul>  <li><a href="javascript:void(0);" onclick="naver('A')">锚点A</a></li>  <li><a href="javascript:void(0);" onclick="naver('B')">锚点B</a></li>  <li><a href="javascript:void(0);" onclick="naver('C')">锚点C</a></li>  <li><a href="javascript:void(0);" onclick="naver('D')">锚点D</a></li></ul><div style="background-color: #f60; height: 400px;" id="A">  AAA</div><div style="background-color: #f06; height: 400px;" id="B">  BBB</div><div style="background-color: #60f; height: 400px;" id="C">  CCC</div><div style="background-color: #06f; height: 400px;" id="D">  DDD</div><script>//设置锚点function naver(id){  var obj = document.getElementById(id);  var oPos = obj.offsetTop;  return window.scrollTo(0, oPos-36);}</script></body></html>

效果图：