Javascript 为什么我不能让演员们一点一点地换？

我正在尝试制作一个非常简单的网站，我只想在我点击顶部相应的列表按钮时更改两个div。但是当我点击第二个列表按钮时，第二个div永远不会出现。我不明白为什么几个小时以来，代码中的所有步骤似乎都是合乎逻辑的。我想在没有Jquery或其他任何东西的情况下完成这项工作

window.onload=function（）{
d1=document.getElementById（'myDiv1'）；
d2=document.getElementById（'myDiv2'）；
函数showDiv1（）{
如果（d2.style.display==“块”）
{
d2.style.display=“无”；
d1.style.display=“块”；
}
其他的
{
返回false；
}
}
函数showDiv2（）{
如果（d1.style.display==“块”）
{
d1.style.display=“无”；
d2.style.display=“块”；
}
其他的
{
返回false；
}
}
}

正文{
保证金：0；
填充：0；
背景重复：无重复；
背景位置：中心；
文本对齐：居中；
字体大小：100%；
身高：100%；
}
.myDiv1、.myDiv2{
背景图片：url（“paper.jpg”）；
背景色：无；
保证金：自动；
身高：80%；
边框：2件纯黑；
边界半径：0px；
文本对齐：左对齐；
/*颜色：白色；
字体系列：“Arial”，时代，衬线；
字体大小：粗体*/
填充：10px；
溢出：自动
}
.myDiv1{
显示：块；
}
.myDiv2{
显示：无；
}
p{
}
.ul1{
列表样式类型：无；
边际：0px；
填充：0px；
溢出：隐藏；
背景色：#dddddd；
高度：70像素；
}
李先生1{
浮动：对；
}
.LI1A{
显示：块；
颜色：黑色；
文字装饰：无；
填充：25px
}
李1：第一个孩子{
右边距：100px；
}
/*成长*/
.hvr生长{
显示：内联块；
垂直对齐：中间对齐；
变换：translateZ（0）；
长方体阴影：0 1px rgba（0,0,0,0）；
背面可见性：隐藏；
-moz osx字体平滑：灰度；
过渡时间：0.3s；
过渡性质：变换；
}
.hvr生长：悬停，
.hvr成长：专注，
.hvr增长：活动{
转换：比例（1.1）；
}
.ul2{
列表样式类型：无；
保证金：20px自动；
填充：0px；
溢出：隐藏；
背景色：黑色；
边框：1px纯黑；
边界半径：20px；
宽度：自动；
显示器：flex；
}
李先生2{
显示：内联；
右边框：1px纯白；
宽度：25%
}
李2：最后一个孩子{
边界权：无；
}
.LI2A{
颜色：白色；
文字装饰：无；
}
.ul3{
列表样式类型：无；
保证金：0；
填充：0；
}
李先生3{
利润率：15px0；
}
#myDiv1:选中~#myDiv.inner{左边距：0；}
#myDiv2:选中~#myDiv.内部{左边距：-100%；}
#myDiv3:选中~#myDiv.inner{左边距：-200%；}

Meine Webseite



这是对这项运动的描述


这是对这项运动的描述


这是对这项运动的描述


这是对这项运动的描述


这是对这项运动的描述


这是对这项运动的描述


这是对这项运动的描述


这是对这项运动的描述


这是对这项运动的描述


这是对这项运动的描述


这是对这项运动的描述


这是对这项运动的描述


这是对这项运动的描述


这是对这项运动的描述


这是对这项运动的描述


这是对这项运动的描述


这是对这项运动的描述


这是对这项运动的描述


这是对这项运动的描述


这是对这项运动的描述


我的名字

d1=document.getElementById（'myDiv1'）；
d2=document.getElementById（'myDiv2'）；
函数showDiv1（）{
if（d1.className.indexOf（'hide'>-1））{
d1.类名。替换（'hide'，''）；
d1.className+=“显示”；
}
}
函数showDiv2（）{
if（d2.className.indexOf（'hide'>-1））{
d2.类名。替换（'hide'，''）；
d2.className+=“显示”；
}
}

.ul2{
列表样式类型：无；
保证金：20px自动；
填充：0px；
溢出：隐藏；
背景色：黑色；
边框：1px纯黑；
边界半径：20px；
宽度：自动；
显示器：flex；
}
李先生2{
显示：内联；
右边框：1px纯白；
宽度：25%
}
李2：最后一个孩子{
边界权：无；
}
.LI2A{
颜色：白色；
文字装饰：无；
}
.ul3{
列表样式类型：无；
保证金：0；
填充：0；
}
李先生3{
利润率：15px0；
}
.隐藏{
显示：无；
}

<
d1 = document.getElementById('myDiv1');
d2 = document.getElementById('myDiv2');

<li class="li1 hvr-grow"  ><a href="#sport" onclick="showDiv1()">SPORT</a>
</li>
<li class="li1 hvr-grow"><a href="#sportler" onclick="showDiv2()">SPORTLER</a>
</li>

window.onload = function() {

    d1 = document.getElementById('myDiv1');
    d2 = document.getElementById('myDiv2');
    function showDiv1() {
       if( d2.style.display == "block" )
       {
          d2.style.display = "none";
          d1.style.display = "block";
       }
       else
       {
          pass;
       }
    }

    function showDiv2() {
       if( d1.style.display == "block" )
       {
          d1.style.display = "none";
          d2.style.display = "block";
       }
       else
       {
          pass;
       }
    }
}