1. 爱易网页
  2. JavaSript
  3. js创建表格跟删除表格中的行

js创建表格跟删除表格中的行

日期：2014-05-16　 浏览次数：20403 次

js创建表格和删除表格中的行
<script>
// 为表增加一行
function create()
{
  var tableObj = document.getElementById("tab");
  alert(tableObj.rows.length);
  var newRowObj = tableObj.insertRow(tableObj.rows.length);
 
  // 此处的顺序应该和下面的顺序一致
  var newColName = newRowObj.insertCell(newRowObj.cells.length);
  var newColGender = newRowObj.insertCell(newRowObj.cells.length);
var newColAge = newRowObj.insertCell(newRowObj.cells.length);
var newColButton=newRowObj.insertCell(newRowObj.cells.length);

newColName.innerHTML = '刘德华';
  newColGender.innerHTML = '男';
  newColAge.innerHTML = 46;
  newColButton.innerHTML = '<input type="button" value="Delete" onclick="deleteCurrentRow(this)">';
}

// 删除一行
function deleteCurrentRow(obj)
{
  var trObj = obj.parentNode.parentNode;
  var tBody = trObj.parentNode;
  tBody.removeChild(trObj);
}

</script>

<html>
<body>
<center>
<input type="button" value="create table" onclick="create()"
<div id="table"></div>
<div>
  <table id="tab">
    <tr>
        <td>姓名</td>
        <td>性别</td>
        <td>年龄</td>
        <td>操作</td>
    </tr>
  </table>
</div>
</center>
</body>
</html>

相关资料更多>

  1. 几个文字加密的 JS 简要算法（字符平移法）和一些个人的想法
  2. 显示一个大图广告，过几秒钟缩回去再显示一个小图。怎么实现
  3. 表单交付成功了 但Ext总是调用 failure
  4. jquery 的一个小疑点
  5. 顺手记：为系统设计一套简易的JavaScript框架需要考虑的要素
  6. JavaScript中怎么判断一个空字符串
  7. JavaScript的逻辑操作符特点
  8. 怎么批量设置文本框的值
  9. node.js mysql-native 判断结果聚合大小