前言
有時候，我們想閱讀頁面中某段精彩的內容，但由于頁面太長，用戶需要自己滾動頁面，查找起來非常麻煩 ，很容易讓人失去繼續往下閱讀的興趣。這樣體驗非常不好，所以我們可以想辦法 實現點擊某段文字或者圖片跳轉到頁面指定位置，方便用戶的閱讀。
一、 純 html 實現
1. 利用 id 為標記的錨點
這里作為錨點的標簽可以是任意元素。
2. 利用 a 標簽的 name 屬性作為錨點
這里作為錨點的標簽只能是 a 標簽。
注意：當以 ' a 標簽 name 屬性作為錨點 ' 和 ' 利用 id 為標記的錨點 ' 同時出現（即以 name 為錨點和以 id 為錨點名字相同時），會將后者作為錨點。
我自己是一名從事了多年開發的web前端老程序員，目前辭職在做自己的web前端私人定制課程，今年我花了一個月整理了一份最適合2020年學習的web前端學習干貨，各種框架都有整理，送給每一位前端小伙伴，想要獲取的可以關注我的頭條號并在后臺私信我：前端，即可免費獲取
二、 js 實現
1. 利用 scrollTo()
window.scrollTo 滾動到文檔中的某個坐標。可提供滑動效果，想具體了解 scrollTo() 可以看看 MDN 中的介紹。
話不多說，看下面代碼
「html 部分」:
「js 部分」:
2. 利用 scrollIntoView()
Element.scrollIntoView() 方法讓當前的元素滾動到瀏覽器窗口的可視區域內。想具體了解 scrollIntoView() 可以看看 MDN 中的介紹。
下面也直接上代碼
「html 部分」:
「js 部分」:
注意：此功能某些瀏覽器尚在開發中，請參考瀏覽器兼容性表格以得到在不同瀏覽器中適合使用的前綴。由于該功能對應的標準文檔可能被重新修訂，所以在未來版本的瀏覽器中該功能的語法和行為可能隨之改變。
下面為了方便看效果，把上面的代碼整理在一起
效果圖：
原文鏈接：https://juejin.im/post/6868968417769029640
