zoukankan      html  css  js  c++  java
  • JS显示隐藏行或列

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
    <HTML>
    <HEAD>
    <TITLE> 显示隐藏列 </TITLE>
    <SCRIPT LANGUAGE="JavaScript">
    <!--
    function setHiddenCol(oTable,iCol)
    {
           for (i=0;i < oTable.rows.length ; i++)
           {
               oTable.rows[i].cells[iCol].style.display = oTable.rows[i].cells[iCol].style.display=="none"?"block":"none";
           }
    }
    function setHiddenRow(oTable,iRow)
    {
           oTable.rows[iRow].style.display = oTable.rows[iRow].style.display == "none"?"block":"none";
    }
    //-->
    </SCRIPT>
    </HEAD>

    <BODY>
    <TABLE id="Table1" cellSpacing="1" cellPadding="1" border="1">

    <TR>
    <TD width="20%">00</TD> <TD width="20%" bgcolor="#E3E3E3">01</TD> <TD width="20%">02</TD>
    </TR>
    <TR>
    <TD width="20%" bgcolor="red">10</TD> <TD width="20%" bgcolor="green">11</TD> <TD width="20%" bgcolor="red">12</TD>
    </TR>
    <TR>
    <TD width="20%">20</TD> <TD width="20%" bgcolor="#E3E3E3">21</TD> <TD width="20%">22</TD>
    </TR>
    </TABLE> </P>


    <INPUT id="btnHiddenCol" type="button" value="显示/隐藏第2列" name="btnHiddenCol" onClick="setHiddenCol(document.getElementById('Table1'),1)">
    <INPUT id="btnHiddenRow" type="button" value="显示/隐藏第2行" name="btnHiddenRow" onClick="setHiddenRow(document.getElementById('Table1'),1)">
    </BODY>
    </HTML>

  • 相关阅读:
    【阿里云产品公测】云引擎ACE新手实战基于Wordpress
    【阿里云产品公测】结构化数据服务OTS之JavaSDK初体验
    洗牌算法详解
    常用的位操作
    字符串乘法
    如何运用二分查找算法
    递归详解
    判断回文链表
    子集、排列、组合问题汇总
    接雨水问题详解
  • 原文地址:https://www.cnblogs.com/superfeeling/p/2130371.html
Copyright © 2011-2022 走看看