onmouseover onmouseout鼠标经历过离开行变色

本文主要是介绍onmouseover onmouseout鼠标经历过离开行变色，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

       <table><thead><th>千机</th><th>千机</th><th>千机</th><th>千机</th></thead><tbody><tr></tr><tr><td>祁珞</td><td>祁珞</td><td>祁珞</td><td>祁珞</td></tr><tr><td>祁珞</td><td>祁珞</td><td>祁珞</td><td>祁珞</td></tr><tr><td>祁珞</td><td>祁珞</td><td>祁珞</td><td>祁珞</td></tr></tbody></table>

HTML代码块

       <style>.bg{background-color: pink;}</style>

CSS样式

        <script>//获取元素，只有一个tbody，所以只获取一个，然后获取所有的trvar trs = document.querySelector('tbody').querySelectorAll('tr');//循环for(var i =0;i<trs.length;i++){//onmouseover鼠标经过事件trs[i].onmouseover = function(){//thisthis.className = 'bg';}//onmouseout鼠标离开事件trs[i].onmouseout = function(){this.className = '';}}</script>

使用className修改样式

这篇关于onmouseover onmouseout鼠标经历过离开行变色的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！

---