querySelector中的Javascript变量返回null

我无法让变量在querySelector中工作。我有这样一个链接：

<a class="ast-linkto linkto-howitworks">Click to Scroll</a>

<section id="howitworks">
Content here.
</section>

下面是一个片段：

document.querySelectorAll（'.ast linkto'）.forEach（函数（项）{
var regx=new RegExp（'\\b'+'链接到-'+'[^]*[]？\\b'，g'）；
var linkToTargetClass=item.className.match（regx，，）[0]；
var linkToTargetId='#'+linkToTargetClass.substring（linkToTargetClass.indexOf（“-”）+1）；
控制台日志（linktoargetid）；
/*请让这些工作之一*/
log（document.querySelector（linktoargetid.innerHTML）；
console.log（document.querySelector（“'”+linkToTargetId+“”）”）.innerHTML）；
})

单击以滚动
内容在这里。

想出了一些办法：

document.querySelectorAll('.ast-linkto').forEach(function(item) {
var regx = new RegExp('\\b' + 'linkto-' + '[^ ]*[ ]?\\b', 'g');
var linkToTargetClass = item.className.match(regx, '')[0];
var linkToTargetId = '#' + linkToTargetClass.substring(linkToTargetClass.indexOf("-") + 1);
console.log(linkToTargetId);

    item.addEventListener('click', function(event) {
        console.log(document.querySelector("" + linkToTargetId + "").innerHTML);
    })
});

---

无论如何，点击这些链接是主要的想法，因此在点击功能中添加console.log是可行的

我用你的代码在问题中添加了一个片段。（我已经添加了缺少的结束语

}）

部分）<代码>文档。查询选择器（linkToTargetId）。innerHTML正在工作。

部分的内容是否在代码运行后的某个时间点异步添加？对我不起作用，请参见：不要添加额外的引号。代码笔与
console.log（document.querySelector（linkToTargetId.innerHTML）一起工作使用数据属性。不需要解析类就可以得到文本。如果我想好了，我会在另一篇评论中发表。谢谢你的帮助@我会使用数据属性，但有时这些链接是从其他地方生成的，我可以添加一个类，但不能添加数据属性。谢谢你的建议！
document.querySelectorAll('.ast-linkto').forEach(function(item) {
var regx = new RegExp('\\b' + 'linkto-' + '[^ ]*[ ]?\\b', 'g');
var linkToTargetClass = item.className.match(regx, '')[0];
var linkToTargetId = '#' + linkToTargetClass.substring(linkToTargetClass.indexOf("-") + 1);
console.log(linkToTargetId);

    item.addEventListener('click', function(event) {
        console.log(document.querySelector("" + linkToTargetId + "").innerHTML);
    })
});