Javascript 获取元素的打印页码

我正在从事一个项目，该项目涉及将PDF手册转换为html。我试图在打印时保留PDF的价值，同时在不受页面概念约束的设备上为它们提供更好的ui。我遇到的问题是，这些手册有一个目录，每个章节的页码从哪里开始。在设备上查看时，该列表将仅位于页面锚定链接中，但在打印时，我希望获取元素的页码（例如第3章标题所在的页面）并将其添加到目录中，尤其是在应用了打印样式后，如

page break after:avoid

作为一个例子，我想知道在打印时如何将页码准确地添加到以下维基百科文章的目录中。

编辑：
我的想法是在打印时使用打印样式表添加页码：

@page {
    @bottom {
        content: "Page " counter(page) " of " counter(pages)
    }
}

然后使用javascript使用matchMedia/onbeforeprint（）检测打印，然后从内容中获取页码，但我不确定如何找到动态添加的内容。可能吗？是否有其他解决方案？
HTML打印会因浏览器而异，因此页面编号也会有所不同。如果你想要真实的页码。你最好还是坚持使用PDF。这另一个问题可以帮助你：@DouglasLise，这是最简单的部分。我需要知道如何/是否可以在打印文档之前获取这些页码并将其插入目录中。对不起@mlrawlings，我弄糊涂了。但您是否尝试过使用“目标计数器”CSS属性？这个链接可以帮助你在里面，通过目标计数找到…@DouglasLise我需要多读一点，但乍一看，这看起来就像我在寻找的。谢谢