<head>
    <title></title>
    <script type="text/javascript">
        //鼠标移动到表格行，被点击的行高亮显示（背景是红色），其他行白色背景。监听每个tr的onclick事件，将点击的背景设置为黄色，其他的设置为白色背景。//对于table、div、span这类型元素没有onfocus（获取焦点的事件（无法触发这些事件。））
        onload = function () {
            //获取行
            var trs = document.getElementById('tb').getElementsByTagName('tr');
            for (var i = 0; i < trs.length; i++) {
                trs[i].onclick = function () {
                    for (var j = 0; j < trs.length; j++) {
                        trs[j].style.backgroundColor = '';
                    }
                    this.style.backgroundColor = 'red';
                };
            }
        };    
    </script>
</head>
<body>
   <table border="1" id="tb" style=" cursor:pointer;">
        <tr>
            <td>周润发
            </td>
             <td>刘德华
            </td>
             <td>周星驰
            </td>
        </tr>
         <tr>
            <td>周润发
            </td>
             <td>刘德华
            </td>
             <td>周星驰
            </td>
        </tr>
         <tr>
            <td>周润发
            </td>
             <td>刘德华
            </td>
             <td>周星驰
            </td>
        </tr>
         <tr>
            <td>周润发
            </td>
             <td>刘德华
            </td>
             <td>周星驰
            </td>
        </tr>
         <tr>
            <td>周润发
            </td>
             <td>刘德华
            </td>
             <td>周星驰
            </td>
        </tr>
         <tr>
            <td>周润发
            </td>
             <td>刘德华
            </td>
             <td>周星驰
            </td>
        </tr>
    </table>
</body>

js table鼠标点击时变色的更多相关文章

  1. JS实现鼠标点击爱心&绘制多边形&每日一言功能

    本篇文章主要介绍我的个人博客 程序猿刘川枫 中页面使用的美化功能(基于JS实现): 1.鼠标点击出现不同颜色爱心特效 2.页面浮动多边形跟随鼠标移动 3.每日一言功能 1.鼠标点击出现爱心特效 经常在 ...

  2. JS控制鼠标点击事件

    鼠标点击事件就是当鼠标点击元素时,就会出现另一个窗口,类似于百度首页中右上角的“登录”这个按钮,当鼠标点击 登录时,就会出现登录窗口.大体的意思就是这样,直接上代码了,简单易懂. <!DOCTY ...

  3. CTreeCtrl获得鼠标点击时的节点

    原文链接: http://blog.csdn.net/lcalqf/article/details/21321923 1.添加图标 HICON icon[10]; icon[0]=AfxGetApp( ...

  4. js获取鼠标点击的对象,点击另一个按钮删除该对象

    作为js的一名新手,对于所谓的event的了解并不是太多,仅仅根据视频教学中的例子模仿着,写了诸如: function funcname(e) { e=window.event||event };的函 ...

  5. js获取鼠标点击事件的相对位置

    <html><head><title>位置</title><script language="javascript" type ...

  6. [UE4]使用PlayerController获取鼠标点击时的坐标

    1,获取鼠标在当前场景中坐标系统的中的position,加入场景地图的范围是一千平方米,那么这个position的范围也是1000米x1000米. 注册鼠标事件 FInputActionBinding ...

  7. js中鼠标点击、移动和光标移动的事件触发

    事件有三要素:事件源.事件数据.事件处理程序 事件冒泡:当元素嵌套的时候,内部元素激发某个事件后,默认情况下外部元素相应的事件也会跟着依次触发 可以加return false;是阻止默认操作 oncl ...

  8. VirtulBox安装虚拟机（鼠标点击时）0x00000000指令引用的0x00000000内存该内存不能为written错误解决方案

    这个错误并不是所有人都会用到,我用的是WIN7系统,公司的电脑.查找了很多原因后,发现的确是由于系统主题被破解过的原因. 手工恢复风险太高.通过下面的工具就可以直接恢复.UniversalThemeP ...

  9. 用js捕捉鼠标连续点击三次事件怎么实现啊

    var count = 0, timer; document.onclick = function(){ if(count < 2){ if(timer){ clearTimeout(timer ...

随机推荐

  1. 【C++竞赛 H】The sum problem

    Time Limit: 1s Memory Limit: 32MB 问题描述 Given a sequence 1,2,3,-,N, your job is to calculate the numb ...

  2. centos7 开启端口防火墙配置(如开启3306或者80端口)

    转载自https://blog.csdn.net/codepen/article/details/52738906 https://www.cnblogs.com/hantianwei/p/57362 ...

  3. linux下如何查找nginx配置文件的位置

    nginx的配置放在nginx.conf文件中,一般我们可以使用以下命令查看服务器中存在的nginx.conf文件. locate nginx.conf /usr/local/etc/nginx/ng ...

  4. cocos2d-x win8下的环境配置和建立项目

    cocos2dx 跨平台.可是看网上说开发最合适还是在vs2010中,基本是编完后再移植到安卓. 1.去官网下载源代码2.2.3版本号的. 2.然后运行根文件夹下的build-win32.bat(须要 ...

  5. 图像数据的 normalization

    Normalization的方法 matlab 工具函数(三)-- normalize(归一化数据) 1. 加载指定标准差的噪声 im_clean = double(imread('Lena512.p ...

  6. VO对象通过groovy模板映射XML文件

    介绍 之前写过JAVA+XSLT相关的技术博客,近期研究了一个开源工具包org.codehaus.groovy,处理VO对象和XML文件映射很方便. 简言之:将VO对象中的属性(包含Collectio ...

  7. js进阶 11-1 jquery中的页面内容操作的三个方法

    jquery中的页面内容操作的三个方法 一.总结 一句话总结:记三个方法即可.text,html,val.因为这里是方法,所以设置值的是后面方法的参数. 1.jquery中的页面内容操作的三个方法? ...

  8. Python将被加入高考科目？你怎么看？

    今天看到这样的一则新闻:不禁感叹,人工智能这股风来的太快,已经掀起全民学习Python的浪潮. 2017年中观察:看上去这个大纲内容基本是这样了,但是实行年份可能要往后推了,不在2017年执行了(据说 ...

  9. js中 慎用for(var o in arrays) 遍历数组，for(var i,i< objects.length;i++)与for(var i,n = objects.length;i<n;i++) 的性能区别

    原文:js中 慎用for(var o in arrays) 遍历数组,for(var i,i< objects.length;i++)与for(var i,n = objects.length; ...

  10. 【codeforces 782D】 Innokenty and a Football League

    [题目链接]:http://codeforces.com/contest/782 [题意] 每个队名有两种选择, 然后第一个选择队名相同的那些队只能选第二种; 让你安排队名 [题解] 首先全都选成第一 ...