鼠标经过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 相关文章推荐
Locate a File Using a File Open Dialog Box
Jun 18 Javascript
基于jQuery的合并表格中相同文本的相邻单元格的代码
Apr 06 Javascript
jQuery实现单击按钮遮罩弹出对话框(仿天猫的删除对话框)
Apr 10 Javascript
JavaScript将字符串转换成字符编码列表的方法
Mar 19 Javascript
jquery选择器简述
Aug 31 Javascript
javascript实现Email邮件显示与删除功能
Nov 21 Javascript
Node.js环境下编写爬虫爬取维基百科内容的实例分享
Jun 12 Javascript
在Web项目中引入Jquery插件报错的完美解决方案(图解)
Sep 19 Javascript
jquery 仿锚点跳转到页面指定位置的实例
Feb 14 Javascript
详解element-ui中form验证杂记
Mar 04 Javascript
Swiper.js实现移动端元素左右滑动
Sep 08 Javascript
ElementUI之Message功能拓展详解
Oct 18 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与paypal整合方法
2010/11/28 PHP
Look And Say 序列php实现代码
2011/05/22 PHP
用js判断用户浏览器是否是XP SP2的IE6
2007/03/08 Javascript
Extjs中常用表单介绍与应用
2010/06/07 Javascript
基于jquery的不规则矩形的排列实现代码
2012/04/16 Javascript
使用GruntJS链接与压缩多个JavaScript文件过程详解
2013/08/02 Javascript
document.documentElement和document.body区别介绍
2013/09/16 Javascript
js操纵dom生成下拉列表框的方法
2014/02/24 Javascript
在css加载完毕后自动判断页面是否加入css或js文件
2014/09/10 Javascript
js防止页面被iframe调用的方法
2014/10/30 Javascript
js实现class样式的修改、添加及删除的方法
2015/01/20 Javascript
JavaScript中实现无缝滚动、分享到侧边栏实例代码
2016/04/06 Javascript
AngularJS 2.0入门权威指南
2016/10/08 Javascript
webpack教程之webpack.config.js配置文件
2017/07/05 Javascript
详解为element-ui的Select和Cascader添加弹层底部操作按钮
2020/02/07 Javascript
jQuery实现购物车全功能
2021/01/11 jQuery
[50:59]2018DOTA2亚洲邀请赛 4.7 总决赛 LGD vs Mineski第四场
2018/04/10 DOTA
Python中生成器和迭代器的区别详解
2018/02/10 Python
利用Python批量提取Win10锁屏壁纸实战教程
2018/03/27 Python
python在文本开头插入一行的实例
2018/05/02 Python
Django ORM多对多查询方法(自定义第三张表&amp;ManyToManyField)
2019/08/09 Python
解决Django layui {{}}冲突的问题
2019/08/29 Python
python实现高斯投影正反算方式
2020/01/17 Python
Pandas中DataFrame基本函数整理(小结)
2020/07/20 Python
python 用Matplotlib作图中有多个Y轴
2020/11/28 Python
Android本地应用打开方法——通过html5写连接
2016/03/11 HTML / CSS
美国地毯购买网站:Rugs USA
2019/02/23 全球购物
雅虎笔试题(字符串操作)
2015/03/24 面试题
革命先烈的英雄事迹材料
2014/02/15 职场文书
师德师风剖析材料
2014/09/30 职场文书
2014年营业员工作总结
2014/11/18 职场文书
2014年个人工作总结报告
2014/11/27 职场文书
2015年三八妇女节活动总结
2015/02/06 职场文书
教师学习心得体会范文
2016/01/21 职场文书
Oracle安装TNS_ADMIN环境变量设置参考
2021/11/01 Oracle
Pytorch中使用ImageFolder读取数据集时忽略特定文件
2022/03/23 Python