(function(){

    // 获取一级标题元素

    var bannerNavUl=document.querySelector('.banner_nav_ul');

    // 获取一级标题的子元素

    var bannerList=bannerNavUl.children;

    // 当鼠标离开大盒子的时候二级菜单取消显示

    var bannerNav=document.querySelector('.banner_nav');

    //   寻找所有的menu

    var menus=document.querySelectorAll('.menu_box .menu');

    bannerNavUl.addEventListener('mouseover',function(e){

        // 采用事件委托获取当前点击的li元素

        if (e.target.tagName.toLowerCase()=='li') {

          var n=  e.target.getAttribute('data-n');

          e.target.className+=' current';

        //   根据一级菜单获取对应得二级菜单

          var theMenu=document.querySelector('.menu_box .menu[data-n='+n+']');

        //   排他操作 让所有的盒子都去掉current类

        for (let i = 0; i < menus.length; i++) {

            menus[i].className='menu';

        }

        theMenu.className='menu current';

        }

    });

    // 鼠标离开一级菜单，二级菜单消失

    bannerNav.addEventListener('mouseleave',function(){

        for (let i = 0; i < bannerList.length; i++) {

            bannerList[i].className=bannerList[i].getAttribute('data-n');

            menus[i].className='menu';

        }

    });

})()