网页跳转到指定位置

（网页跳转到指定位置）有时候，我们想阅读页面中某段精彩的内容，但由于页面太长，用户需要自己滚动页面，查找起来非常麻烦 ，这样体验非常不好，所以我们要实现点击某段文字或者图片跳转到页面指定位置，方便用户的阅读。

方法一

利用 id 为标记的 锚点

这里作为锚点的标签可以是任意元素。

<p id="title">标题</p>

<a href="#title">跳转到标题</a>

方法二

这里作为锚点的标签只能是 a 标签。

<a name="title">标题</a>

<a href="#title">跳转到标题</a>

注意：当以 ' a 标签 name 属性作为锚点 ' 和 ' 利用 id 为标记的锚点 ' 同时出现(即以 name 为锚点和以 id 为锚点名字相同时)，会将后者作为锚点。

方法三

利用 scrollTo()

function to(toEl) {
      // toEl 为指定跳转到该位置的DOM节点
      let bridge = toEl;
      let body = document.body;
      let height = 0; // 计算该 DOM 节点到 body 顶部距离
      do {
        height += bridge.offsetTop;
        bridge = bridge.offsetParent;
      } while (bridge !== body); // 滚动到指定位置
      window.scrollTo({ top: height, behavior: "**ooth" });
}
to();

• top 等同于  y-coord
• left 等同于  x-coord
• behavior  类型String,表示滚动行为,支持参数 **ooth(平滑滚动),instant(瞬间滚动),默认值auto,实测效果等同于instant