2

这个问题参考了这篇文章。

总之，要求是让导航中的链接根据当前滚动位置更改状态，我能够让这里提供的代码工作，但是我不明白为什么这样做的一行是

while(--index && window.scrollY + 50 < sections[index].offsetTop) {}

我会评论原始答案帖子，但显然，我的声誉还不够。

这是整个 JavaScript 代码

const links = document.querySelectorAll('.links');
const sections = document.querySelectorAll('section');

function changeLinkState() {
  let index = sections.length;

  while(--index && window.scrollY + 50 < sections[index].offsetTop) {}
  
  links.forEach((link) => link.classList.remove('active'));
  links[index].classList.add('active');
}

changeLinkState();
window.addEventListener('scroll', changeLinkState);

为什么需要while循环，因为它是空的，它不会做任何事情吗？我尝试删除 while 循环，但它最终破坏了代码。

4

1 回答 1

2 
while(--index && window.scrollY + 50 < sections[index].offsetTop) {}

这会随着每次迭代而递减索引。当window.scrollY + 50 < sections[index].offsetTop为 false 时循环停止，并且索引保持为最后一次“通过”检查的值。

以后用来更新links[index].classList.add('active');

它也可以这样写：

while (index >= 0 && window.scrollY + 50 < sections[index].offsetTop) {
    index--
}

需要检查 index 是否有足够的值（也不是 -1 或更低），否则当它达到 -1 时会出错，因为sections[-1].something不存在。

于 2019-04-18T16:02:34.913 回答