`

js 添加表格的行

阅读更多

function addRow(content) 

    //添加一行 
    var newTr = listTable.insertRow(); 
    //添加一列 
    var newTd0 = newTr.insertCell(); 
    //设置列内容和属性 
    newTd0.innerHTML = content; 

<input type="button" name="Submit" value="添加一行" onclick="addRow("dddddddd")" /> 
<table id="listTable" border=1 cellspacing="0" bordercolor="#CCCCCC"> 
</table>
这样写在IE下没问题,但是在Firefox就不显灵了,如果你利用try catch可以看到出错信息,大概是缺少参数,表格的行列添加时要指定是第几行和第几列。换成这样就没问题了。

 

function addRow(content) 

try{
    //添加一行 
    var newTr = listTable.insertRow(0); 
    //添加一列 
    var newTd0 = newTr.insertCell(0); 
    //设置列内容和属性 
    newTd0.innerHTML = content; 
} catch(e){alert(e);}
}
上面是添加到第一行了,如果想加到指定行,加一个隐藏域存储行数应该就可以了。

 

分享到:
评论

相关推荐

    js 添加删除表格

    以下是一个简单的例子,展示如何使用JavaScript添加和删除表格行: ```javascript // 获取表格元素 var table = document.getElementById('myTable'); // 添加行 function addRow() { var row = table.insertRow...

    javascript动态添加表格数据行

    总结来说,这个示例展示了如何使用JavaScript在前端动态添加表格行,以及如何通过表单提交这些数据到服务器。虽然例子使用的是较旧的技术(如IE6和ASP),但基本的JavaScript逻辑仍然适用于现代Web开发。在现代Web...

    JAVASCRIPT自动添加表格

    首先,让我们来理解“JavaScript自动添加表格”。在HTML中,表格由`&lt;table&gt;`元素定义,行(`&lt;tr&gt;`)、列(`&lt;td&gt;`或`&lt;th&gt;`)以及表头(`&lt;thead&gt;`)和表体(`&lt;tbody&gt;`)等组成。在JavaScript中,我们可以利用DOM(Document ...

    JavaScript动态添加删除表格行

    1. **添加表格行**: 要动态添加一行,首先需要获取到表格的引用,通常是通过`document.getElementById`或`document.querySelector`来实现。然后,创建一个新的`&lt;tr&gt;`元素,并为它添加需要的`&lt;td&gt;`子元素。最后,...

    javascript实现表格添加删除等操作

    HTML部分可能包括`&lt;table&gt;`标签,`&lt;tr&gt;`(表格行)、`&lt;td&gt;`(表格单元格)以及可能的`&lt;button&gt;`元素,这些按钮会触发添加或删除行的操作。 `students.js`文件则是JavaScript代码,用于处理与HTML交互的部分。以下是...

    纯javascript增加删除表格行

    以上就是使用纯JavaScript进行表格行增删的基本步骤。在实际项目中,可能还需要结合CSS来美化表格,或者使用AJAX异步加载数据,使功能更加完善。通过不断实践和学习,你可以掌握更高级的JavaScript技巧,以应对各种...

    javascript改变表格行的颜色

    ### JavaScript 改变表格行颜色的方法 在网页开发中,使用JavaScript来动态改变表格行的颜色是一种常见的技术。这种技术不仅可以提升用户体验,还可以增加网站的交互性。本文将详细介绍如何使用JavaScript来实现这...

    JavaScript动态添加表格行(使用模板、标记)

    在JavaScript编程中,动态添加表格行是一项常见的任务,特别是在创建数据展示或编辑功能时。本文将深入探讨如何使用模板和标记技术来实现这一功能。首先,我们先了解一下基本概念。 **1. 模板(Template)** 模板是...

    ASP+JS实现表格实时添加行

    在网页开发中,ASP(Active Server Pages)是一种服务器端脚本环境,...以上就是利用ASP和JavaScript实现实时添加表格行的基本流程和关键代码示例。实际应用中,还需要考虑错误处理、用户体验优化以及数据验证等问题。

    jQuery 动态添加或删除表格行

    要动态添加表格行,我们通常会在用户触发某个事件(如点击按钮)时执行相关操作。以下是一个基本的示例: ```html 添加行 初始数据 ``` ```javascript $(document).ready(function() { var rowNum = 1; ...

    js动态添加表格

    javascript实现动态的添加表格功能

    自动在html中使用js添加表格

    要实现动态添加表格行,我们主要利用JavaScript来操作DOM。以下是一个基本的示例,展示了如何在点击按钮时添加新行: ```html &lt;!DOCTYPE html&gt; ()"&gt;添加行 姓名 年龄 张三 &lt;td&gt;30 function add...

    动态插入、添加删除表格行的JS代码

    ### 动态插入、添加删除表格行的JS代码 在网页开发中,表格是一个非常重要的元素,用于展示数据。为了使网页更具交互性,我们常常需要动态地对表格进行操作,比如插入或删除行等。本文将通过一个具体的示例来讲解...

    JS动态增加删除表格行

    本文将深入探讨如何使用JavaScript动态地增加和删除表格行。 首先,我们来了解一下HTML表格的基本结构。一个表格由`&lt;table&gt;`元素包含,其中包含`&lt;tr&gt;`(表格行)元素,每行内可以有多个`&lt;td&gt;`(表格数据单元格)或`...

    JavaScript实现动态添加表格中的行

    在JavaScript编程中,动态添加表格行是一个常见的需求,特别是在数据可视化或者用户交互丰富的网页应用中。这个功能允许我们在用户操作或者接收到服务器数据时,实时地向HTML表格中插入新的行,更新显示的信息。以下...

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

    在动态添加表格行的场景中,JavaScript可以监听用户的操作,如点击按钮,然后在HTML表格中插入或移除行。以下是一个简单的示例: ```html 内容 &lt;td&gt;&lt;button onclick="addRow()"&gt;添加&lt;/button&gt;&lt;/td&gt; &lt;td&gt;...

    jquery添加表格行

    使用jQuery添加表格行,可以先创建一个新的`&lt;tr&gt;`元素,然后将它插入到表格中。以下是一个简单的示例: ```javascript // 创建新行 var newRow = $("&lt;tr&gt;&lt;td&gt;新数据1&lt;/td&gt;&lt;td&gt;新数据2&lt;/td&gt;&lt;/tr&gt;"); // 将新行插入...

    js 操作表格动态添加和删除行

    js 操作表格动态添加和删除行

Global site tag (gtag.js) - Google Analytics