javascript报表操作大全：表格排序/倒序、动态添加列、批量删除、删除一行、隔行变色、鼠标悬浮切换背景色、全选/反选。（IE、火狐都兼容）
日期：2014-05-16 浏览次数：20474 次
javascript表格操作大全：表格排序/倒序、动态添加列、批量删除、删除一行、隔行变色、鼠标悬浮切换背景色、全选/反选。（IE、火狐都兼容）
表格.html
表格.html
- HTML code
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>表格操作</title>
<script type= "text/javascript" src="domutil.js" ></script>
</head>
<body>
<!--以下数据纯属虚构，为排序而随意填写的-->
<table id="tab" border="1" style =" align:center;text-align:center ">
<thead style="background:#0000FF" onmouseover="over(this)" onmouseout="out(this)">
<tr>
<th><input type="checkbox" name="quan" onclick="quan()" style="cursor:pointer"/>全选</th>
<th onclick="sortTable('tab',1,'int')" style="cursor:pointer">编号</th>
<th onclick="sortTable('tab',2,'汉字')" style="cursor:pointer">编程语言</th>
<th onclick="sortTable('tab',3,'汉字')" style="cursor:pointer">所属公司</th>
<th onclick="sortTable('tab',4,'float')" style="cursor:pointer">市场份额</th>
<th onclick="sortTable('tab',5,'date')" style="cursor:pointer">诞生日期</th>
<th style="cursor:pointer">操作</th>
</tr>
</thead>
<tbody id="tbody">
<tr style="background:#00FF00" onmouseover="over(this)" onmouseout="out(this)">
<td><input type="checkbox" name="checkbox" /></td>
<td width=100 id="ID">4</td>
<td id="name" width="100">Java</td>
<td id="company" width="100" >甲骨文公司</td>
<td id="age" width="100">47.6</td>
<td id="date" width="100">1970/09/09</td>
<td ><input type="button" value="删除" onclick="deleteRow(this.parentNode.parentNode)"/></td>
</tr>
<tr style="background:#00FFFF" onmouseover="over(this)" onmouseout="out(this)">
<td><input type="checkbox" name="checkbox" /></td>
<td width=100 id="ID">6</td>
<td id="name" width="100">C</td>
<td id="company" width="100">微软公司</td>
<td id="age" width="100">30.3</td>
<td id="date" width="100">1980/09/09</td>
<td ><input type="button" value="删除" onclick="deleteRow(this.parentNode.parentNode)"/></td>
</tr>
<tr style="background:#00FF00" onmouseover="over(this)" onmouseout="out(this)">
<td><input type="checkbox" name="checkbox" /></td>
<td width=100 id="ID">3</td>
<td id="name" width="100">PHP</td>
<td id=&quo
免责声明： 本文仅代表作者个人观点，与爱易网无关。其原创性以及文中陈述文字和内容未经本站证实，对本文以及其中全部或者部分内容、文字的真实性、完整性、及时性本站不作任何保证或承诺，请读者仅作参考，并请自行核实相关内容。
