zoukankan      html  css  js  c++  java
  • 7,js操作table.tBodies,tHead,tFoot,rows.cells

    js操作table,获取tbody:tBodies, 获取thead:tHead; 获取tfoot:tFoot; 获取tr:rows; 获取td:cells;

    鼠标移入变色:

    <table>
        <thead>
            <td>序号</td>
            <td>姓名</td>
            <td>年龄</td>
            <td>操作</td>
        </thead>
        <tbody>
            <tr>
               <td>1</td>
               <td>刘一</td>
               <td>22</td>
               <td></td>
            </tr>
            <tr>
               <td>2</td>
               <td>浩二</td>
               <td>23</td>
               <td></td>
            </tr>
            <tr>
               <td>3</td>
               <td>张三</td>
               <td>25</td>
               <td></td>
            </tr>
            <tr>
               <td>4</td>
               <td>王伟</td>
               <td>22</td>
               <td></td>
            </tr>
            <tr>
               <td>5</td>
               <td>王三</td>
               <td>22</td>
               <td></td>
            </tr>
        </tbody>
        
    </table>    <script>
        window.onload=function(){
            var oTab=document.getElementById('tab1');
            var aTr=oTab.tBodies[0].rows;
            //隔行变色;
    var iBg='';
        for(var i=0;i<aTr.length;i++){ if(i%2=0){ aTr[i].style.background=' '; }else{ aTr[i].style.background='#ccc'; }
            
           //鼠标移动变色;
           aTr[i].onmouseover=function(){
              iBg=this.style.background;//保留原有的背景色;
              aTr[i].style.background='green';
    }
           aTr[i]。onmouseout=function(){
             aTr[i].style.background=iBg;
           } }
           }
    </script>
  • 相关阅读:
    hdu 4685(强连通分量+二分图的完美匹配)
    图的连通性问题
    poj 1904(强连通分量+完美匹配)
    poj 2186 "Popular Cows"(强连通分量入门题)
    poj 1236(强连通分量分解模板题)
    EOJ2018.10 月赛
    21.Merge Two Sorted Lists
    20.Valid Parentheses
    19.Remove Nth Node From End of List
    18.4Sum
  • 原文地址:https://www.cnblogs.com/maoduoduo/p/3144839.html
Copyright © 2011-2022 走看看