js实现导航菜单点击切换选中时高亮状态

     <div id="headBoxFontHome" class="active">首页</div> 
     <div id="headBoxFontQuestion">常见问题</div>
     <div id="bogBox">
        <div id="homeBox"></div>
        <div id="qustionBox"></div>
    </div>
    
**css**

    active{color:red; }
    div{
          display: flex;
        justify-content: center;
        border-bottom: 1px solid;
        margin-right: 10px;
    }
    
**js**

       var home=document.getElementById("headBoxFontHome");
       var qustion=document.getElementById("headBoxFontQuestion");    
        var homeBox=document.getElementById("homeBox");
       var qustionBox=document.getElementById("qustionBox");
       var bigBox=document.getElementById("bigBox");
         var falg=1;
         var tag=1;
           home.onclick = function()
           { 
               falg = 1;     //修改标志位
               baobao(falg); 
           }
           qustion.onclick = function()
           { 
              falg = 2;
               baobao(falg);
           }
           function baobao(falg)
           {
               switch (falg)
               {
                   case 1:
                   {
                       home.className = "active";  
                       qustion.className = "";
                       homeBox.style.display="block"
                       qustionBox.style.display="none"
                   }
                       break;
                   case 2:
                   {
                        home.className = "";  
                        qustion.className = "active";  
                        homeBox.style.display="none"
                        qustionBox.style.display="block"
                   }
                       break;
                   default:
                       break;
               }
           }