javascript表格内容的展开和折叠

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>表格内容的展开和折叠</title>
    <style>
        h2,h5,#tooltipMsg,p {
            white-space: nowrap;
        }
        td {
            border: 1px solid #ccc;
            height: 50px;
            text-align: center;
            font-size: 10pt;
            padding: 2px;
        }
    </style>
</head>
<body>
<table id="tableOutIn" border="1" width="500">
    <tr>
        <td>1</td>
        <td>2</td>
    </tr>
</table>
<input type="button" id="openRow" data-statu="true" value="展开/收缩" />
    <script>
        window.οnlοad=function(){
            var tableOutIn=function(e,type){  //没有var声明在ie上会报错
                if(!type){
                    e.style.display="none";//隐藏指定的行元素
                }
                else {
                    e.style.display="table-row"; //table-row设置此元素会作为一个表格行显示
                }
            }
            var _tableOutIn=document.getElementById("tableOutIn"),statu=true;
            document.getElementById("openRow").οnclick=function(){ //展开一行 openRow
                statu=!statu;
                tableOutIn(_tableOutIn.rows[0],statu);
            }
        }
    </script>
</body>
</html>
javascript表格内容的展开和折叠

悦读
