<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">

<title>Examples</title>

<meta name="description" content="">

<meta name="keywords" content="">

<link href="" rel="stylesheet">

<script>

    window.onload=function(){

        var oTab=document.getElementById("tab1");

        var oldColor="";

        // alert(oTab.tBodies[0].rows[1].cells[1].innerHTML);

        for(var i=0;i<oTab.tBodies[0].rows.length;i++){

            oTab.tBodies[0].rows[i].onmouseover=function(){

                oldColor=this.style.background;

                this.style.background="green";

            }

            oTab.tBodies[0].rows[i].onmouseout=function(){

               this.style.background=oldColor;

            }

            if(i%2){

                oTab.tBodies[0].rows[i].style.background="#ccc";

            }else{

                 oTab.tBodies[0].rows[i].style.background="";

            }

        }

    }

</script>

</head>

<body>

    <table id="tab1" border='1' width="500px">

        <thead>

            <td>ID</td>

            <td>姓名</td>

            <td>年龄</td>

        </thead>

        <tbody>

            <tr>

                <td>1</td>

                <td>张三</td>

                <td>12</td>

            </tr>

            <tr>

                <td>1</td>

                <td>李四</td>

                <td>34</td>

            </tr>

            <tr>

                <td>1</td>

                <td>王五</td>

                <td>40</td>

            </tr>

            <tr>

                <td>1</td>

                <td>李四</td>

                <td>34</td>

            </tr>

            <tr>

                <td>1</td>

                <td>王五</td>

                <td>40</td>

            </tr>

        </tbody>

    </table>

</body>

</html>

大多数人不知道的表格其他写法的onmouseover效果的更多相关文章

  1. [Swift通天遁地]二、表格表单-(4)使用系统自带的下拉刷新控件，制作表格的下拉刷新效果

    ★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★➤微信公众号:山青咏芝(shanqingyongzhi)➤博客园地址:山青咏芝(https://www.cnblogs. ...

  2. 很多人不知道的Python 炫技操作：条件语句的写法

    有的人说 Python 是一门 入门容易,但是精通难的语言,这一点我非常赞同. Python 语言里有许多(而且是越来越多)的高级特性,是 Python 发烧友们非常喜欢的.在这些人的眼里,能够写出那 ...

  3. 很多人不知道的Python 炫技操作：海象运算符的三种用法

    Python 版本发展非常快,如今最新的版本已经是 Pyhton 3.9,即便如此,有很多人甚至还停留在 3.6 或者 3.7,连 3.8 还没用上. 很多 Python 3.8 的特性还没来得及了解 ...

  4. 大多数人不知道的：HashMap链表成环的原因和解决方案

    引导语 在 JDK7 版本下,很多人都知道 HashMap 会有链表成环的问题,但大多数人只知道,是多线程引起的,至于具体细节的原因,和 JDK8 中如何解决这个问题,很少有人说的清楚,百度也几乎看不 ...

  5. 初始CSS3小知识【99%人不知道的小技巧】

    一.引入样式    1.行内样式表   <h1 style="color: red;font-size: 18px;">10-30</h1>     2.内 ...

  6. 10个很多人不知道的Redis使用技巧

    前言 Redis 在当前的技术社区里是非常热门的.从来自 Antirez 一个小小的个人项目到成为内存数据存储行业的标准,Redis已经走过了很长的一段路.随之而来的一系列最佳实践,使得大多数人可以正 ...

  7. 一般人不知道的Flask框架SQLAlchemy的那些事

    目录 SQLAlchemy 1.介绍 2.简单使用(能创建表,删除表,不能修改表) 3.一对多关系 4.多对多关系 5.操作数据表 6.基于scoped_session实现线程安全 7.基本增删查改 ...

  8. 一个很多人不知道的SpringBoot小技能！！

    大家好,我是冰河~~ 最近,发现很多小伙伴在修改了SpringBoot的配置文件后,都要重新编译整个项目,极大的浪费了开发时间.我身边就有很多小伙伴一直是这样做的.那么,有没有什么方式能够修改配置文件 ...

  9. 5种做法实现table表格中的斜线表头效果

    table表格,这个东西大家肯定都不陌生,代码中我们时常都能碰到,那么给table加一个斜线的表头有时是很有必要的,但是到底该怎么实现这种效果呢? 我总结了以下几种方法: 1.最最最简单的做法 直接去 ...

随机推荐

  1. 杂记：Linux下gcc升级

    公司要求,需要在CentOS6.5系统下进行一些测试.因为编写的测试程序中使用了一些C++11之后新增的特性,而CentOS6.5中安装的gcc版本为4.4.7,并不支持C++11,所以需要对gcc进 ...

  2. es6this箭头函数

    1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 < ...

  3. 推荐一款在UBUNTU下使用的编辑器

    偶然的机会 ,发现了这款软件,以前一直是在用gedit编辑器,但在WINDOWS下写的文档,在ubuntu下用gedit打开后,复制有换行的问题,一直没解决,所以在网上找到了这款软件,安装使用了几天, ...

  4. Linux 信号介绍

    是内容受限时的一种异步通信机制 首先是用来通信的 是异步的 本质上是 int 型的数字编号,早期Unix系统只定义了32种信号,Ret hat7.2支持64种信号,编号0-63(SIGRTMIN=31 ...

  5. Rails工程实战记录

    项目git:https://github.com/yixiaoyang/ruby 为熟悉Rails的基本特性创建的工程,本博文仅作更新记录. (1)2013.10.1-2013.10.5 Ruby基本 ...

  6. 达拉草201771010105《面向对象程序设计（java）》第十六周学习总结

    达拉草201771010105<面向对象程序设计(java)>第十六周学习总结 第一部分:理论知识 1.程序与进程的概念: (1)程序是一段静态的代码,它是应用程序执行的蓝 本. (2)进 ...

  7. ASP.NET CORE 启动过程及源码解读

    在这个特殊的春节,大家想必都在家出不了们,远看已经到了回城里上班的日子,但是因为一只蝙蝠的原因导致我们无法回到工作岗位,大家可能有的在家远程办公,有些在家躺着看书,有的是在家打游戏:在这个特殊无聊的日 ...

  8. file_put_contents生成ansi文件

    $line_body = array('张三','李四','王五'); $line_body = array_map(function ($element){return iconv('UTF-8', ...

  9. 2020年春招面试必备Spring系列面试题129道（附答案解析）

    前言 关于Spring的知识总结了个思维导图分享给大家   1.不同版本的 Spring Framework 有哪些主要功能?   2.什么是 Spring Framework? Spring 是一个 ...

  10. 解决 Highcharts 中 yAxis 的 max 设置无效的问题

    问题场景 $(function () { Highcharts.chart('container', { title: { text: 'line' }, xAxis: { categories: [ ...