如何使用javascript识别视图中的锚点

我有一个导航选项卡，指向页面的不同部分，由ID标识：

<section id="1"></section>
<section id="2"></section>
<section id="3"></section>

然后我链接到我的导航链接中的部分：

<a href="#1"></a>

现在，当浏览器的视口中显示相应的部分时，我想对导航链接应用一些自定义样式

单击链接会将id添加到URL的末尾，但由于我希望即使用户没有单击任何链接也能应用样式，因此我觉得这不是一个有效的解决方案

是否有一个CSS属性是我用javascript检查的，它告诉我某个部分在视图中

我正在寻找一种可以使用多种屏幕尺寸的解决方案。

您可以使用或类似的解决方案。其思想是检查视口中的元素，并通过js分配相应的类

这也可以在没有任何库的情况下轻松完成：

侦听文档上的滚动事件

运行您的计算功能（这应该是）

选择所有导航项目并检查它们是否在视口中（偏移+高度）

分配课程

---

查找“jquery滚动间谍”。->这可能也是有用的问题是，这需要一个引导导航组件，因为我没有在我的解决方案的其余部分使用引导，我觉得这是过分的