在 JavaScript 中滾動到特定元素

Kushank Singh 2023年1月30日 2021年10月2日

JavaScript

我們將討論如何使用 JavaScript 在不同瀏覽器中獲取瀏覽器視窗可見區域中的指定元素。

完成此任務的方法如下。

JavaScript 中使用 `scroll()` 函式滾動到特定元素

元素介面的 scroll() 函式滾動到給定元素內的一組特定座標。這適用於 Chrome 和 Firefox 而不適用於其他。

window.scroll(0,findPos(document.getElementById("myDiv")));

我們使用 getElementById() 方法獲取所需的元素。我們在 scroll() 函式中傳遞它以滾動到所需的元素。

在這裡，我們可以在 JavaScript 中將 href 值設定為指向網頁中的錨點。

location.href = "#";
location.href = "#myDiv";

這裡 #myDiv 是所需 <div> 標籤的 ID。

scrollIntoView() 函式將提供的元素移動到瀏覽器視窗的可視區域。這最適合 IE、Safari 和 Edge 使用者。

例如，

document.querySelector('#myDiv').scrollIntoView({
  behavior: 'smooth'
});

behavior 屬性描述了滾動的外觀。在我們的示例中，它設定為平滑。這個屬性也可以用在 scroll() 函式中。