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

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&nbsp;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 variablenavigation.innerHTML = sections.map(section => {&nbsp; &nbsp; const sectId = section.id;&nbsp; &nbsp; const sectNav = section.dataset.name;&nbsp; &nbsp; return `<li><a class="links_menu" href="#${sectId}">${sectNav}</a></li>`;}).join('\n');// query the li after creationconst links = document.querySelectorAll('li')告诉我这是否有帮助。编辑：我完全错过了您在变量中重新查询它们的情况linkErrays，所以我的答案对您当前的问题没有帮助。