我正在努力为我博客中的每个副标题（h2元素）动态创建标记，然后用副标题的文本填充这些标记。
这是我目前所尝试的：

<script>

            const subheadings = document.querySelectorAll("h2");
            subheadings.forEach(function(x) {
              document.getElementById("contents").innerHTML=x;
              <a href='#' id="contents"></a>
            });
              
</script>

这导致什么都没有出现。
任何帮助或建议，在哪个方向看是非常感谢。

编辑

我已将代码更新为响应中给出的答案。

<div class="col-3" id="contents-table">
          <script>

            const subheading = document.querySelectorAll('h2');
            subheading.forEach(function(x) {              
              let xbe = x.innerText.split(' ');
              for (let i = 0; i<xbe.length;i++) {
              const div = document.getElementById('contents-table');
              let a = document.createElement('a');
              a.innerText = xbe[i];
              console.log( a.innerText); 
              div.append(a);
              }
                });
              
          </script>
        </div>

希望这能提供所有必要的信息。
然而，它仍然没有显示h2元素的文本，但我认为逻辑是正确的。