案例:表格中鼠标经过每行就高亮的功能

<script>
    // 1. 获取元素,获取的是tbody里面所有的行
    var trs = document.querySelector('tbody').querySelectorAll('tr');
    // 2. 利用循环绑定注册事件
    for (var i = 0; i < trs.length; i++) {
        // 3. 鼠标经过事件 onmouseover
        trs[i].onmouseover = function() {
                // 更换样式
                this.className = 'bg';
        }
        // 4. 鼠标离开事件 onmouseout
        trs[i].onmouseout = function() {
                // 取消样式
                this.className = '';
        }
    }
</script>

 

posted @ 2020-05-21 22:26  浮华夕颜  Views(307)  Comments(0Edit  收藏  举报