活动类保持激活状态，我需要该激活类在滚动时不保持活动状态

Question

这是全局变量const navigation = document.getElementById('nav_list');const sections = document.querySelectorAll('section');const links = document.querySelectorAll('li')let navLinks = '';该函数用于创建导航。const navMaker = function() {    sections.forEach(section => {                const sectId = section.id;                const sectNav = section.dataset.name;                navLinks = navLinks + `<li><a class="links_menu" href="#${sectId}">${sectNav}</a>                 </li>`;    });    navigation.innerHTML = navLinks; } navMaker();该函数用于添加和删除活动类这个常量用于访问所有列表：const linkErrays = document.querySelectorAll('li');const level = (section) => {    return Math.floor(section.getBoundingClientRect().top)}const delateClass = (section) => {    section.classList.remove('active_section');}const addClass = (condition, section) => {    if (condition) {        section.classList.add('active_section');    }}这是当有人滚动时的类激活const classActivation = () => {      linkErrays.forEach(section => {        const elementLevel = level(section);        inviewport = () => elementLevel < 50  && elementLevel >= -650        delateClass(section);    addClass(inviewport(), section);  });}window.addEventListener('scroll', classActivation);

Answer 1

只需向窗口添加一个滚动事件，然后删除该类或切换它。IE window.addEventListener('scroll', ()=>{ element.classList.remove('active'); })




Answer 2

我可能是错的，但我认为只选择li一次并且在实际生成它们之前可能是导致问题的原因，我建议先生成它们，如下所示：

const navigation = document.getElementById('nav_list');

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

// using map / join to avoid the navLinks variable

navigation.innerHTML = sections.map(section => {

    const sectId = section.id;

    const sectNav = section.dataset.name;

    return `<li><a class="links_menu" href="#${sectId}">${sectNav}</a></li>`;

}).join('\n');

// query the li after creation

const links = document.querySelectorAll('li')

告诉我这是否有帮助。

编辑：我完全错过了您在变量中重新查询它们的情况linkErrays，所以我的答案对您当前的问题没有帮助。