我可以在 href 中使用錨點來滾動到具有類名但沒有 id 的位置嗎？

Question

我正在使用 Javascript 並且我需要一個類名的錨點，因為我們在該位置附近沒有 id。 我可以在 href 標簽中使用錨點來執行此操作嗎？

該示例是使用 id 的錨點：

<div id='anchorID'>
<a href='mysite.com#anchorID>

但是，如果我只有類名，我可以這樣做嗎？ 使用錨，而不是 scrollInToView 或其他東西：

<div class='myclass'>

謝謝！

Answer 1

URL有必要顯示這個錨點嗎？ 如果沒有閱讀有關scrollIntoView的信息。

如果您只需要 url 來完成導航，那么id或name屬性（在元素本身上）是您唯一的選擇。

順便說一句，可以使用名為scroll-behavior的 CSS 屬性來實現平滑滾動到正常工作的錨點的良好視覺效果：

html
{
        scroll-behavior: smooth;
}

這與您的問題無關，但我認為您可能會喜歡它。

Answer 2

只有 Href 不適用於 class。 你可以用 javascript/jQuery 做

<a href='javascript:void(0)' data-target='.myClass'>Link</a>

jQuery

$("[data-target]").on('click', function(){
   var target_  = $(this).attr("data-target");
   var targetSelector = $(target_);
   if(targetSelector.length){
      $("html, body").animate({ scrollTop: targetSelector.offset().top }, 1000);
   }
})