Javascript 在尝试切换时，浏览器加载的额外div正在破坏我的脚本

您好，我正在做一个简单的切换，当我点击导航选项时隐藏和显示某些文本块。我通过运行for循环并使用length.div确定要显示或隐藏的确切div来实现这一点。例如，seowaukebar将div添加到我的源代码中，因此如果有人有div.length更改，我需要找到解决方法。以下是我的Javascript：

function forLoopToggle(id) {

var chosenTab = document.getElementById(id);

//loop between the 6th and after divs - the initial value is for Google chrome, and if someone has SEO quake because an extra div is added in that case
for (var toggle = 6;  toggle < div.length; toggle++) {

        //for clicking on experience
        if (div[toggle] == chosenTab && chosenTab.id == 'experience' && chosenTab.style.display != 'block') {   
                        div[toggle].style.display = 'block';
                        div[++toggle].style.display = 'block';
                        div[++toggle].style.display = 'block';
                        div[++toggle].style.display = 'block';
                        div[++toggle].style.display = 'block';
                        div[++toggle].style.display = 'block';
                        div[5].style.display = 'block';//employment div
                        div[6].style.display = 'none';
                    }

        //for clicking on projects
        if (div[toggle] == chosenTab && chosenTab.id == 'projects' && chosenTab.style.display != 'block') { 
                        div[toggle].style.display = 'block';
                        div[++toggle].style.display = 'block';
                        div[++toggle].style.display = 'block';
                        div[++toggle].style.display = 'block';
                        div[++toggle].style.display = 'block';
                        div[5].style.display = 'none';
                        div[6].style.display = 'block';//keyword div
                    }

        //for clicking on a div which display is currently none
        else if (div[toggle] == chosenTab && chosenTab.style.display != 'block') {
                        div[toggle].style.display = 'block';
                        div[5].style.display = 'none';
                        div[6].style.display = 'none';
        }

        //all divs that have not been clicked on will not be shown
        else if  (div[toggle] != chosenTab) {
                        div[toggle].style.display = 'none';
        }       
        else if  (div[toggle] = chosenTab && chosenTab.style.display == 'block') {
                        div[toggle].style.display = 'none';
        }   
        //allows you toggle on and off of the same div

        else {
                        div[toggle].style.display = 'none';
                        div[5].style.display = 'none';
                        div[6].style.display = 'none';
            }
}

循环切换功能（id）{ var chosenTab=document.getElementById（id）； //在第6个div和第6个div之后循环-初始值是针对Google chrome的，如果有人因为在这种情况下添加了额外的div而导致SEO震动 用于（变量切换=6；切换

---

}

您可以显示/隐藏类似的部分，或使用类似的工具在两个不同版本的内容之间切换。虽然从

内部启动javascript函数在技术上是不受欢迎的，但它确实起到了作用。我需要学习如何使用纯javascript正确地完成这项工作，但这只是一个开始

---

注意：在JSFIDLE中，出于某种原因，我不得不使用内联javascript，但实际上，您可以将函数放在单独的JS文件中。

向divs添加一个类，而不是根据

.length

进行计算？