1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4.     <meta charset="UTF-8">
  5.     <title>Title</title>
  6. </head>
  7. <body>
  8. <table border="1" width="300px">
  9.      <tr ><td>1</td><td>2</td><td>3</td></tr>
  10.      <tr ><td>1</td><td>2</td><td>3</td></tr>
  11.      <tr ><td>1</td><td>2</td><td>3</td></tr>
  12. </table>
  13.      <script>
  14.  
  15.            var myTrs = document.getElementsByTagName('tr')
  16.            var len= myTrs.length;
  17.            for (var i=0; i<len; i++){
  18.                myTrs[i].onmouseover = function(){
  19.                this.style.backgroundColor = 'red'
  20.                };
  21.                myTrs[i].onmouseout = function(){
  22.                this.style.backgroundColor = ''
  23.                }
  24.            }
  25.  
  26. //         function t1(n){
  27. //           var myTrs = document.getElementsByTagName('tr')[n];
  28. //           console.log(myTrs);
  29. //           myTrs.style.backgroundColor = 'red';
  30. //         }
  31. //          function t2(n){
  32. //           var myTrs = document.getElementsByTagName('tr')[n];
  33. //           console.log(myTrs);
  34. //           myTrs.style.backgroundColor = '';
  35. //         }
  36.  
  37.      </script>
  38.  
  39. </body>
  40. </html>

html 1.0 鼠标放上去会亮 onmouseover onmouseout 以及this标签的使用的更多相关文章

  1. 扩充 jQuery EasyUI Datagrid 数据行鼠标悬停/离开事件（onMouseOver/onMouseOut）

    客户需求: jQuery EasyUI Datagrid 用户列表鼠标悬停/离开数据行时显示人员头像(onMouseOver/onMouseOut) 如图所示,Datagrid 鼠标悬停/离开数据行时 ...

  2. 扩展 jQuery EasyUI Datagrid 数据行鼠标悬停/离开事件（onMouseOver/onMouseOut）

    客户需求: jQuery EasyUI Datagrid 用户列表鼠标悬停/离开数据行时显示人员头像(onMouseOver/onMouseOut) 如图所示,Datagrid 鼠标悬停/离开数据行时 ...

  3. css 鼠标移动到按钮图片改变；图片换层；鼠标放上透明度改变直到隐藏；

    css 鼠标移动到按钮图片改变: 方法一: <style> .pp a { width:575px; height:157px; background:url(1.jpg);/*图片地址* ...

  4. 用css3实现鼠标移进去当前亮其他变灰

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/ ...

  5. JS实现 鼠标放上去 图片自动放大的效果

    前段时间做项目,要实现,一张图片,鼠标放上去图片自动变大的效果,虽然难度不大,但当时也想了一段时间,当时没时间记录一下,现在有时间了,写篇博客把代码给记录一下: 效果如下: 代码如下: <!DO ...

  6. 鼠标放上去图片慢慢变大js 或 变大

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  7. 点击图片或者鼠标放上hover .图片变大. 1)可以使用css中的transition, transform 2) 预先设置一个 弹出div. 3)弹出层 alert ; 4) 浏览器的宽度document.documentElement.clientWidth || document.body.clientWidth

    变大: 方法一: 利用css属性. 鼠标放上 hover放大几倍. .kecheng_02_cell_content img { /*width: 100px; height: 133px;*/ wi ...

  8. jquery鼠标放上去显示悬浮层即弹出定位的div层

    <div><a id="a1" onmouseover="javascript:show('a1','div1');" onmouseout= ...

  9. marquee 标签的鼠标放上去滚动效果 鼠标离开继续滚动

    效果很实用,可以轻松的实现鼠标放上去停止滚动.鼠标离开继续滚动的效果.下面是具体的用法(特别注意onMouseOver和onMouseOut是需要同时写进去才会出现比较好的效果):onMouseOut ...

随机推荐

  1. PowerDesigner16工具学习笔记-创建RQM

    1.点击标准工具条中的

  2. JAVA中的>>和>>>号以及<<号的作用

    public static void main(String[] args) { //右移2位,输出结果为2.二进制1000右移2位变为0010 System.out.println(8>> ...

  3. 移动web开发适配方案之Rem

    移动端为什么要做适配 移动端相对PC端来说大部分浏览器内核都是基于Webkit的,所以大部分都支持CSS3的最新语法.但是由于手机的屏幕尺寸和分辨率都不太一样(尤其是安卓),所以不得不对不同分辨率的手 ...

  4. halcon之屌炸天的变形匹配（1）

    在日常工程应用中,我们通常通过halcon的 shape-based matching(形状匹配)进行各种定位, 如以前文章介绍的这样,理解各个参数并灵活应用通常就能得到很好的匹配效果和匹配速度, 当 ...

  5. 用 Python 快速实现 HTTP 和 FTP 服务器

      用 Python 快速实现 HTTP 服务器 有时你需临时搭建一个简单的 Web Server,但你又不想去安装 Apache.Nginx 等这类功能较复杂的 HTTP 服务程序时.这时可以使用  ...

  6. flask第二十五篇——控制语句

    有兴趣的请加船长公众号:自动化测试实战 先和大家强调一个发邮件的问题 # coding: utf-8 import smtplib from email.mime.text import MIMETe ...

  7. Ztree小demo用于系统授权

    本示例只做到指定id用户的拥有的权限回显,并能动态获得ztree中重新选择的权限id.(至于权限的更新,就是后台人员对象和权限对象建立关系的过程,不做展示) 第一步:拼写jsp页面(下载ztree包, ...

  8. 重新学习之spring第一个程序，配置IOC容器

    第一步:导入相关jar包(此范例导入的是spring3.2.4版本,spring2.5版本只需要导入spring核心包即可) 第二步:在项目的src下配置applicationContext.xml的 ...

  9. Git 学习记录一

    主要来源参考http://www.runoob.com/git/git-install-setup.html Windows 平台上安装 在 Windows 平台上安装 Git 同样轻松,有个叫做 m ...

  10. macOS -- 如何通过终端开启/关闭SSH

    在macOS中(较新版),基本都会配置了SSH,能完成我们开发中绝大部分功能,所以不需要再去使用第三方的软件去操作. 不过SSH守护进程是默认禁用的,我们需要手动开启 1. 查看是否开始SSH功能 s ...