javascript - 滚动时获取标题哈希

Question

我有一个包含多个标题的页面（h1，h2，h3）。当我滚动页面时，我需要获取标题ID并将其作为哈希值放入URL中。

以下示例代码。

<div>
  <h1 id="random_numbers_here"> 
    <p> lorem ipsum </p>
  <h1 id="random_numbers_here"> 
    <p> lorem ipsum </p>
  <h2 id="random_numbers_here"> 
    <p> lorem ipsum </p>
  <h3 id="random_numbers_here"> 
    <p> lorem ipsum </p>
  <h3 id="random_numbers_here"> 
    <p> lorem ipsum </p>
</div>

我的JS代码：

$('.page').on('scroll',(function(){
    var winTop = $('.page').scrollTop();
    var h1 = $('h1');
    var h2 = $('h2');
    var h3 = $('h3');

    $(h1).each(function(){
        console.log(
        $(this).offset().top < winTop +10 
        && $(this).offset().top + $(this).height() > winTop + 10);
    })
}));

当我的“标题检测器”生效时只需$（this）.attr（'id'）并使用window.location.hash将其放入URL中。

但它在错误的标题上给出了我的真假。在h2上，当我在h3时它返回true。

我不知道如何使这项工作。