鼠标经过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 相关文章推荐
Javascript在IE或Firefox下获取鼠标位置的代码
Dec 18 Javascript
jQuery autocomplate 自扩展插件、自动完成示例代码
Mar 28 Javascript
JavaScript高级程序设计 XML、Ajax 学习笔记
Sep 10 Javascript
JS实现拖动示例代码
Nov 01 Javascript
无闪烁更新网页内容JS实现
Dec 19 Javascript
jquery根据锚点offset值实现动画切换
Sep 11 Javascript
Javascript Object 对象学习笔记
Dec 17 Javascript
JavaScript Drum Kit 指南(纯 JS 模拟敲鼓效果)
Jul 23 Javascript
对vue.js中this.$emit的深入理解
Feb 23 Javascript
在小程序中使用canvas的方法示例
Sep 17 Javascript
layui多iframe页面控制定时器运行的方法
Sep 05 Javascript
解决vue-cli项目开发运行时内存暴涨卡死电脑问题
Oct 29 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实现小型站点广告管理(修正版)
2006/10/09 PHP
Php中文件下载功能实现超详细流程分析
2012/06/13 PHP
PHP+jQuery实现自动补全功能源码
2013/05/15 PHP
PHP使用glob函数遍历目录或文件夹的方法
2014/12/16 PHP
XHProf报告字段含义的解析
2016/05/17 PHP
thinkPHP多语言切换设置方法详解
2016/11/11 PHP
详谈php ip2long 出现负数的原因及解决方法
2017/04/05 PHP
php实现生成带二维码图片并强制下载功能
2018/02/24 PHP
php post json参数的传递和接收处理方法
2018/05/31 PHP
javascript对象的property和prototype是这样一种关系
2007/03/24 Javascript
弹出广告特效(一个IP只弹出一次)的代码
2007/07/27 Javascript
javascript动画对象支持加速、减速、缓入、缓出的实现代码
2012/09/30 Javascript
JS打开层/关闭层/移动层动画效果的实例代码
2013/05/11 Javascript
JS如何将UTC格式时间转本地格式
2013/09/04 Javascript
jquery获取div距离窗口和父级dv的距离示例
2013/10/10 Javascript
Javascript 中创建自定义对象的方法汇总
2014/12/04 Javascript
js实现方块上下左右移动效果
2017/08/17 Javascript
jQuery plugin animsition使用小结
2017/09/14 jQuery
JS实现table表格内针对某列内容进行即时搜索筛选功能
2018/05/11 Javascript
使用vue-infinite-scroll实现无限滚动效果
2018/06/22 Javascript
深入浅出理解JavaScript高级定时器原理与用法
2018/08/02 Javascript
关于vue v-for循环解决img标签的src动态绑定问题
2018/09/18 Javascript
详解React之key的使用和实践
2018/09/29 Javascript
vue+webpack中配置ESLint
2018/11/07 Javascript
在layer弹层layer.prompt中,修改placeholder的实现方法
2019/09/27 Javascript
python实现复制整个目录的方法
2015/05/12 Python
Django对数据库进行添加与更新的例子
2019/07/12 Python
python通过TimedRotatingFileHandler按时间切割日志
2019/07/17 Python
numpy 返回函数的上三角矩阵实例
2019/11/25 Python
css3动画事件—webkitAnimationEnd与计时器time事件
2013/01/31 HTML / CSS
CSS3实现多样的边框效果
2018/05/04 HTML / CSS
整理的15个非常有用的 HTML5 开发教程和速查手册
2011/10/18 HTML / CSS
最常使用的求职信
2014/05/25 职场文书
护士求职简历自我评价
2015/03/10 职场文书
详解Laravel服务容器的优势
2021/05/29 PHP
MyBatis 动态SQL全面详解
2021/10/05 MySQL