鼠标经过tr时,改变tr当前背景颜色


Posted in Javascript onJanuary 13, 2014

示例如下:

<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=GBK">
<title>鼠标经过给tr换颜色</title>    
</head>
<body>
<table align="center" width="100%" border="1" cellspacing="1" cellpadding="1" >
  <tr style="cursor:hand " onmousemove="changeTrColor(this)">
    <td align="center">1</td>
    <td height="20"> 123</td>
    <td height="20"> abvx</td>
    <td height="20"> 465465</td>
    <td height="20">546654654</td>
  </tr>
  <tr style="cursor:hand " onmousemove="changeTrColor(this)">
    <td align="center">1</td>
    <td height="20"> 123</td>
    <td height="20"> abvx</td>
    <td height="20"> 465465</td>
    <td height="20">546654654</td>
  </tr>    
  <tr style="cursor:hand " onmousemove="changeTrColor(this)">
    <td align="center">1</td>
    <td height="20"> 123</td>
    <td height="20"> abvx</td>
    <td height="20"> 465465</td>
    <td height="20">546654654</td>
  </tr>
</table>
<script type="text/javascript">
function changeTrColor(obj){    
    var _table=obj.parentNode;
    for (var i=0;i<_table.rows.length;i++){
        _table.rows[i].style.backgroundColor="";
    }    
    obj.style.backgroundColor="blue";
}
</script>
</form>
</body>
</html>
Javascript 相关文章推荐
jquery(live)中File input的change方法只起一次作用的解决办法
Oct 21 Javascript
CSS+jQuery实现的一个放大缩小动画效果
Sep 24 Javascript
table对象中的insertRow与deleteRow使用示例
Jan 26 Javascript
JS实现往下不断流动网页背景的方法
Feb 27 Javascript
使用Chart.js图表库制作漂亮的响应式表单
Oct 28 Javascript
JavaScript动态创建form表单并提交的实现方法
Dec 10 Javascript
AngularJS使用ng-repeat和ng-if实现数据的删选显示效果示例【适用于表单数据的显示】
Dec 13 Javascript
微信小程序 Canvas增强组件实例详解及源码分享
Jan 04 Javascript
基于JavaScript实现屏幕滚动效果
Jan 18 Javascript
Element-ui tree组件自定义节点使用方法代码详解
Sep 17 Javascript
Vue安装浏览器开发工具的步骤详解
May 12 Javascript
Vue 解决在element中使用$notify在提示信息中换行问题
Nov 11 Javascript
js导航栏单击事件背景变换示例代码
Jan 13 #Javascript
JS文本获得焦点清除文本文字的示例代码
Jan 13 #Javascript
javascript间隔定时器(延时定时器)学习 间隔调用和延时调用
Jan 13 #Javascript
parentElement,srcElement的使用小结
Jan 13 #Javascript
javaScript中的this示例学习详解及工作原理
Jan 13 #Javascript
JS 日期比较大小的简单实例
Jan 13 #Javascript
JS之Date对象和获取系统当前时间详解
Jan 13 #Javascript
You might like
php 将字符串按大写字母分隔成字符串数组
2010/04/30 PHP
PHP实现绘制二叉树图形显示功能详解【包括二叉搜索树、平衡树及红黑树】
2017/11/16 PHP
PHP实现关键字搜索后描红功能示例
2019/07/03 PHP
javascript 全角转换实现代码
2009/07/17 Javascript
关于Mozilla浏览器不支持innerText的解决办法
2011/01/01 Javascript
js实现一个省市区三级联动选择框代码分享
2013/03/06 Javascript
js获取指定日期前后的日期代码
2013/08/20 Javascript
jQuery中parentsUntil()方法用法实例
2015/01/07 Javascript
JavaScript中数据结构与算法(一):栈
2015/06/19 Javascript
js实现TAB切换对应不同颜色的代码
2015/08/31 Javascript
浅析javascript的return语句
2015/12/15 Javascript
jQuery简单实现彩色云标签效果示例
2016/08/01 Javascript
在网页中插入百度地图的步骤详解
2016/12/02 Javascript
JS运动特效之完美运动框架实例分析
2018/01/24 Javascript
浅谈jquery fullpage 插件增加头部和版权的方法
2018/03/20 jQuery
基于jQuery实现Ajax验证用户名是否可用实例
2018/03/25 jQuery
如何在Angular8.0下使用ngx-translate进行国际化配置
2019/07/24 Javascript
js+canvas实现图片格式webp/png/jpeg在线转换
2020/08/22 Javascript
Python RuntimeError: thread.__init__() not called解决方法
2015/04/28 Python
Python中函数的参数定义和可变参数用法实例分析
2015/06/04 Python
Python实现SVN的目录周期性备份实例
2015/07/17 Python
python 类详解及简单实例
2017/03/24 Python
Python机器学习之决策树算法
2017/12/22 Python
浅谈django三种缓存模式的使用及注意点
2018/09/30 Python
解决Python列表字符不区分大小写的问题
2019/12/19 Python
python重要函数eval多种用法解析
2020/01/14 Python
html+css3实现的登录界面
2020/12/09 HTML / CSS
canvas实现手机的手势解锁的步骤详细
2020/03/16 HTML / CSS
Footshop罗马尼亚:最好的运动鞋选择
2019/09/10 全球购物
如何写出高性能的JSP和Servlet
2013/01/22 面试题
视图的作用
2014/12/19 面试题
行政部工作岗位职责范本
2014/03/05 职场文书
感恩老师的演讲稿
2014/05/06 职场文书
致百米运动员广播稿5篇
2014/10/13 职场文书
小学秋季运动会通讯稿
2015/11/25 职场文书
2019年年中工作总结讲话稿模板
2019/03/25 职场文书