案例：下拉菜单功能

<script>
    // 1. 获取元素
    var nav = document.querySelector('.nav');
    var lis = nav.children;  // 得到4个小li
    // 2. 循环注册事件
    for (var i = 0; i < lis.length; i++) {
        lis[i].onmouseover = function() {
            // 每个小li的第二个子元素显示，也就是下拉菜单
            this.children[1].style.display = 'block';
        }
        lis[i].onmouseover = function() {
            this.children[1].style.display = 'none';
        }
    }
</script>