<html>
<head>
<title>Table对象的方法</title>
<script language="JavaScript">
var intRowIndex = 0;
function insertRow(tbIndex){
   var objRow = myTable.insertRow(tbIndex);
   var objCel = objRow.insertCell(0);
   objCel.innerText = document.myForm.myCell1.value;
   var objCel = objRow.insertCell(1);
   objCel.innerText = document.myForm.myCell2.value;
   objRow.attachEvent("onclick", getIndex);
   objRow.style.background = "pink";
}
function deleteRow(tbIndex){
   myTable.deleteRow(tbIndex);
}
function getIndex(){
   intRowIndex = event.srcElement.parentElement.rowIndex;
   pos.innerText = intRowIndex;
}
</script>
</head>
<body onload="pos.innerText=intRowIndex;">
<h2>Table对象的方法</h2>
<hr>
当前位置 : <span id="pos"></span>
<table id="myTable" border=1>
<tr onclick="getIndex()">
   <td>HTML</td>
   <td>CSS</td>
</tr>
<tr onclick="getIndex()">
   <td>JavaScript</td>
   <td>VBScript</td>
</tr>
</table>
<form name="myForm">
第一栏 : <input type="text" name="myCell1" value="CGI"><br>
第二栏 : <input type="text" name="myCell2" value="ASP"><br>
<input type="button" onclick="insertRow(intRowIndex)" value="插入行">
<input type="button" onclick="deleteRow(intRowIndex)" value="删除行">
<input type="button" onclick="insertRow(myTable.rows.length);" value="添加行">
</form>
</body>
</html> 

动态插入、添加删除表格行的JS代码的更多相关文章

  1. DHTMLX 前端框架 建立你的一个应用程序 教程(十一)--添加/删除表格中的记录

    添加/删除表格中的记录 我们的最终功能是在表格中添加删除 我们通过单机工具栏上的按钮来实现添加删除 当我们单击添加按钮的时候, 表单中 第一行默认填写New contact 光标自动聚焦 当用户点击删 ...

  2. jquery 无刷新添加/删除 input行 实时计算购物车价格

    jquery 无刷新添加/删除 input行 实时计算购物车价格 jquery 未来事件插件jq_Live_Extension.js 演示 <script> $(document).rea ...

  3. Js实现动态添加删除Table行示例

    <table cellpadding="0" cellspacing="0" border="1" style="margi ...

  4. 添加删除表格(js完成)【自己实际项目】

    // 通过dom对象完成 注释掉了 /** function insertRows(){ var tempRow=0; var tbl=document.getElementById("di ...

  5. 添加删除表格append或 createElement

    方法一: js代码:增加一行五列的表格 function AddList(){ $len= document.getElementsByName('goods_name[]').length; obj ...

  6. C#通过Ado.net对连接数据库并进行添加删除等常规操作的代码

    如下资料是关于C#通过Ado.net对连接数据库并进行添加删除等常规操作的内容. static string sqlcon = "server=.;database=;Integrated ...

  7. js回车动态添加表格,右键动态删除表格行

    <script type="text/javascript" language="javascript">//屏蔽浏览器右键function sto ...

  8. Jquery动态添加/删除表格行和列

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  9. ASP.NET+ashx+jQuery动态添加删除表格

    aspx: <script src="../script/jquery-1.4.4.min.js" type="text/javascript" lang ...

随机推荐

  1. 用Phaser实现Flappy Bird 游戏

    How to Make a Flappy Bird in HTML5 With Phaser - Part 1 Flappy Bird is a nice little game with easy ...

  2. OpenMP求完数

    源代码: #include "stdafx.h" //必须写在首行,因为其前面的include都会被忽略 #include "omp.h" #include & ...

  3. 图像的 SNR 和 PSNR 的计算

    PSNR 的公式很容易搜到. http://www.360doc.com/content/12/0605/21/4129998_216244993.shtml http://blog.sina.com ...

  4. AX2012 R3升级CU8的一些错误

    AX2012 R3安装升级包CU8后进入系统,系统会提示打开软件升级清单“Software update checklist”,清单列出了升级要做的一系列动作. 在进行到编译应用时“Compile a ...

  5. BATCH(BAT批处理命令语法)

    bat语法备忘扩展名是bat(在nt/2000/xp/2003下也可以是cmd)的文件就是批处理文件[@more@] bat语法备忘扩展名是bat(在nt/2000/xp/2003下也可以是cmd)的 ...

  6. eclipse mybatis Generator

    国内私募机构九鼎控股打造APP,来就送 20元现金领取地址:http://jdb.jiudingcapital.com/phone.html内部邀请码:C8E245J (不写邀请码,没有现金送)国内私 ...

  7. Dalvik虚拟机简要介绍和学习计划

    文章转载至CSDN社区罗升阳的安卓之旅,原文地址:http://blog.csdn.net/luoshengyang/article/details/8852432 我们知道,Android应用程序是 ...

  8. AJAX载入外部JS文件到页面并让其执行的方法(附源码)

    一. 向HTML页面中动态添加JS文件(从外部载入)并让其执行的两种方法 1.只适用于IE浏览器的简单方法: 先在文档中放置一张JS"空床"并添加ID:<script id= ...

  9. Hadoop2.9.0安装

    参考 https://hadoop.apache.org/docs/stable/hadoop-project-dist/hadoop-common/SingleCluster.html 1.下载并解 ...

  10. 【pytorch】关于Embedding和GRU、LSTM的使用详解

    1. Embedding的使用 pytorch中实现了Embedding,下面是关于Embedding的使用. torch.nn包下的Embedding,作为训练的一层,随模型训练得到适合的词向量. ...