`

动态添加删除table

    博客分类：
  • js
JavaScriptXHTMLHTML 
阅读更多 
<!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=utf-8" />
<title>无标题文档</title>
</head>
<script type="text/javascript" >
var  n  =   1 ;
  function  testAdd()
    {
      var  tr  =  document.getElementById( "xxx" ).insertRow( 1 );
    tr.id = " new_ " + n;
      var  c1  =  tr.insertCell();
     c1.innerText = " xxx " + n;
      var  c2  =  tr.insertCell();
     c2.innerText = " bbb " ;
  
      var  c3  =  tr.insertCell();
    	 c2.innerText = " EE " ;
     n ++ ;    
 } 
  function  doDelete(i)
  {
    var _tableObj = document.getElementById("xxx"); 	
	 var rowIndex = event.srcElement.parentElement.parentElement.rowIndex;  
   _tableObj.deleteRow(rowIndex);
  
 } 
</script>
<body>  
  <input name="" type="button" onclick = " testAdd() "  value="+"/>
  <input name="" type="button" onclick = " doDelete() "  value="-"/>
  <table width="100%" border="1" cellspacing="0" cellpadding="0" id="xxx">
  <tr id="xxx">
    <td>1</td>
    <td>2</td>
    <td>3</td>
  </tr>
</table>

</body>
</html>

 

分享到：
| 几种开源的AJAX框架（jQuery,Mootools,Dojo ...
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

    JQuery动态添加删除table行.

    在网页开发中，jQuery是一个非常流行的JavaScript库，它极大地简化了DOM操作，包括动态地添加和删除表格行。本文将深入探讨如何使用jQuery实现这一功能，以提高网页交互性。 一、HTML基础 首先，我们需要一个基本...

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

    在介绍Js实现动态添加和...以上知识点构成了“Js实现动态添加删除Table行示例”文章的核心内容。读者在理解并掌握了这些知识点后，就能够灵活地运用JavaScript技术来实现各种对表格行的动态操作，提升网页的交互能力。

    table动态增加删除行列

    使用javascript实现table动态增加删除行列。

    JS动态添加、删除Table行排序（删除整行、删除整列）

    这篇教程将专注于如何使用JavaScript动态地添加、删除Table的行，并实现排序功能，包括删除整行和整列。以下是对这些概念的详细解释： 1. **动态添加Table行：** 要动态添加行，我们可以使用`document....

    添加删除TABLE行

    javascript添加删除table行

    table动态添加行

    "table动态添加行"这个主题就涉及到如何在`HTML`表格中实现这些功能。 首先，我们要理解基本的`HTML`表格结构。一个简单的`HTML`表格由`&lt;table&gt;`标签开始，内部包含`&lt;tr&gt;`（表格行）、`&lt;th&gt;`（表头单元格）和`&lt;td&gt;`...

    C# Winform TabControl选项卡 动态添加，删除，修改

    本教程将详细讲解如何实现TabControl的动态添加、删除和修改功能。 首先，让我们了解TabControl的基本结构。TabControl由一个或多个TabPage组成，每个TabPage上可以放置其他控件，如Label、Button等。在编程时，...

    利用js动态添加删除table行的示例代码

    如下所示： 代码如下://动态添加行function addRow(){ var table = document.getElementById(“tableID”); var newRow = table.insertRow(); //创建新行 var newCell1 = newRow.insertCell(); //创建新单元格 ...

    利用jquery给指定的table动态添加一行、删除一行的方法

    这篇文章主要介绍了如何使用jQuery在指定的HTML表格（table）中动态地添加和删除行。jQuery是一种广泛使用的JavaScript库，它简化了DOM操作，包括在表格中动态修改内容。 首先，我们要理解HTML表格的基本结构，一个...

    一个动态添加table行的js例子

    在JavaScript编程中，动态添加和删除表格行是一个常见的需求，特别是在网页交互和数据展示中。这个例子主要展示了如何使用JS实现这一功能。首先，我们来理解这个“动态添加table行的js例子”的核心知识点。 1. **...

    往动态Table里添加动态控件

    在IT领域，动态地在表格（Table）中添加控件是一项关键的技术，它涉及到前端界面交互和后端数据处理。动态Table添加动态控件通常应用于数据输入、展示和管理的场景，例如表单填写、数据编辑等。在这个例子中，我们将...

    HTML TABLE批量添加行与删除行

    HTML TABLE批量添加行与删除行.javascript实现。

    JSP中使用JavaScript动态插入删除输入框实现代码.docx

    JSP中使用JavaScript动态插入删除输入框实现代码 JSP（Java Server Pages）是一种基于Java技术的服务器端脚本语言，主要...通过JavaScript代码，我们可以动态地添加或删除输入框，提高了Web应用程序的交互性和灵活性。

    树形表格菜单 动态添加节点/动态删除节点/动态移动节点

    3.动态添加节点/动态删除节点/动态移动节点 4.动态dom对象创建表格树 5.完美支持json格式数据,支持xml(需转换) 6.支持ajax加载节点 7.事件驱动 8.可以动态根据列内容排序 9.简化函数参数,利用{} object输入参数,风格...

    jquery表格动态添加删除行代码.zip

    本示例“jquery表格动态添加删除行代码”利用jQuery的强大功能，为用户提供了一个直观且用户友好的表格管理体验。这个代码实现了一个功能，即在表格中动态地添加和删除行，这对于数据展示和编辑是非常实用的。 首先...

    动态添加/删除表格行并提交内容到后台

    在开发Web应用时，动态添加和删除表格行是常见的需求，尤其在数据管理或表单填写场景中。本文将深入探讨如何使用C#后端和JavaScript前端技术来实现这一功能，为初学者提供一个基础的实践指导。 首先，我们要了解...

    动态添加删除表!格动态添加删除表格!

    在IT领域，尤其是在网页开发和用户界面设计中，动态添加删除表格是一项常用的技术。它允许用户根据需求在界面上自由地增加或减少表格行或列，提高了交互性和用户体验。本篇将深入探讨这一主题，主要关注如何实现这个...

    table JS 添加行和删除行

    在本话题中，我们将深入探讨如何使用JavaScript来添加和删除HTML表格（table）中的行。这对于构建数据展示或者管理界面非常实用。 首先，让我们了解HTML表格的基本结构。一个简单的HTML表格由`&lt;table&gt;`标签定义，每...

Magicbox
Global site tag (gtag.js) - Google Analytics