无法锚定通过Firebase查询创建的动态生成的列表项的链接

Question

我在第A页有一个推荐标题列表。我希望每个标题直接链接到第B页的更多详细信息，这样用户就不必向下滚动来查找它。

根据登录用户的帐户数据，第A页上的推荐链接列表和第B页上的推荐详细信息都是通过类似的Firebase查询生成的。

这是页面A查询，用于创建链接列表：

    // list a hyperlink for each recommendation made for this report
        snapshot.forEach(function(child) {
            var p = document.createElement('p');
            p.innerHTML = '<a href="recommendations.html#recommend' + child.val().number + '"><b>' + child.val().number + '</b> - ' + child.val().title + '</a>';
            recommendationsCalloutList.appendChild(p);

});

对于第A页，每个链接的输出html如下所示：

<a href="recommendations.html#recommend1"><b>1 - Eat some sushi</a>

这是页面B查询：

// list each active recommendation for this account
    snapshot.forEach(function(child) {
        var div = document.createElement('div');
        var h3 = document.createElement('h3');

        h3.innerHTML = '<b id="recommend' + child.val().number + '">' + child.val().number + '</b> - ' + child.val().title;

    // populate div with the dynamically generated HTML elements
        activeRecommendationsList.appendChild(div);
        div.appendChild(h3);

});

如果您注意到H3元素的id附加了相同的＆＃39; child.val（）。number＆＃39;变量作为为页面A生成的锚链接。

这是页面B HTML：

<section id="activeRecommendationsList">
<div><h3><b id="recommend1">1</b> - Eat some sushi</h3></div>
</section>

如果有帮助的话，我有链接到DOM元素下面的脚本。

这是我的第一篇文章，很抱歉，如果不清楚的话。非常感谢提前。