关于Js下拉导航的解释

Posted 2020-08-06

 

// 定义一个方法sfHover

    sfHover = function ()

    {

        // 获取id为nav的dom元素里面的每个li元素, sfEls是个集合

        var sfEls = document.getElementById ("nav").getElementsByTagName ("LI");

        // 循环里面的每个li元素对象

        for ( var i = 0; i < sfEls.length; i++)

        {

            // 给每个li元素设置onmouseover事件,鼠标滑过事件

            sfEls[i].onmouseover = function ()

            {

                // 当鼠标滑过li时，被滑过的li的class属性在原来的基础上加上 sfhover

                this.className += " sfhover";

            }

            // 给每个li设置鼠标移出事件

            sfEls[i].onmouseout = function ()

            {

                // 当鼠标移出时，把原来加上的 sfhover去掉

                this.className = this.className.replace (new RegExp (" sfhover\\b"), "");

            }

        }

    }

    // 如果浏览器支持window.attachEvent方法，就调用这个方法

    if (window.attachEvent)

    {

        // 调用onload方法，把sfHover加载到其中

        window.attachEvent ("onload", sfHover);

    }