`
ootabc
  • 浏览: 110796 次
  • 性别: Icon_minigender_1
  • 来自: 湖南
社区版块
存档分类
最新评论

javascrip 动态添加行

    博客分类：
  • js
Java 
阅读更多 
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=gb2312">
        <title>增加Table行</title>
    </head>
    <script>
        function addRow(obj)
        {
        //添加一行
        var newTr = testTbl.insertRow();
        //添加两列
        var newTd0 = newTr.insertCell();
        var newTd1 = newTr.insertCell();
        //设置列内容和属性
        newTd0.innerHTML = '<input type=checkbox id="box4">'; 
        newTd1.innerText= '新加行';
        }
    </script>
    <body>
        <table id="testTbl" border=1>
            <tr id="tr1">
                <td ><input type=checkbox id="box1"></td>
                <td id="b">第一行</td>
            </tr>
            <tr id="tr2">
                <td ><input type=checkbox id="box2"></td>
                <td id="b">第二行</td>
            </tr>
            <tr id="tr3">
                <td ><input type=checkbox id="box3"></td>
                <td>第三行</td>
            </tr>
        </table>        
        <br />
        <input type="button" id="add" onclick="addRow();" value="Add Row" />
    </body>
</html>
分享到：
| javascrip date
评论
发表评论

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

相关推荐

    利用javascript动态添加行(原创)

    在JavaScript编程中，动态添加行是一项常见的任务，特别是在构建数据驱动的Web应用或者处理表格数据时。这个技术允许用户在运行时向HTML表格或其他结构化元素中插入新的内容，提高用户体验，无需页面刷新。以下是对...

    table 使用js 高效 动态添加行

    在网页开发中，表格（Table）是展示数据的常用元素，而JavaScript（js）则提供了强大的功能来操作DOM（文档对象模型），包括动态地向表格中添加行。本篇文章将详细探讨如何使用JavaScript高效地实现表格动态添加行，...

    js动态添加行

    在JavaScript中，动态添加行是一项常见的任务，尤其在构建数据驱动的Web应用时，如表格、列表或表单。这个过程涉及到DOM（Document Object Model）操作，它允许我们通过JavaScript来创建、修改或删除HTML元素。以下...

    JavaScript动态添加删除表格行

    在JavaScript编程中，动态添加和删除表格行是一个常见的需求，特别是在网页交互和数据展示中。这篇博客"JavaScript动态添加删除表格行"可能详细讲解了如何使用JavaScript实现这一功能。通过给定的标签"源码"和"工具...

    javascript动态添加表格数据行

    在JavaScript编程中，动态添加表格数据行是一种常见的需求，特别是在构建交互式的Web应用程序时。这个功能允许用户在不刷新整个页面的情况下添加新的记录，提高了用户体验。在这个例子中，我们将探讨如何利用...

    js动态添加行和列

    在JavaScript编程领域，动态添加行和列是一种常见的需求，特别是在处理表格数据时。这涉及到DOM（文档对象模型）操作，允许网页在不重新加载的情况下更新其结构和内容。以下是对如何使用JavaScript动态添加行和列的...

    动态添加行动态添加行

    动态添加行指的是在用户执行特定操作（如点击按钮）时，通过JavaScript在页面上的表格或列表中插入新的行。这种功能在数据输入、展示可变数量的信息或者允许用户自定义内容的场景中非常实用。 首先，理解基本的HTML...

    给 Table 增加行的 JavaScript 函数

    标题 "给 Table 增加行的 JavaScript 函数" 暗示了我们要讨论的是如何在 HTML 表格（Table）中动态添加行的方法，这是一个常见的前端开发任务，尤其是在构建数据展示或者用户交互的网页应用时。JavaScript 作为...

    用js实现的动态添加一行

    在JavaScript的世界里，动态添加行是一项常见的操作，尤其在处理表格数据或构建可交互的用户界面时。这个“用js实现的动态添加一行”的实践项目是针对AJAX和JavaScript技术的一个基础练习，它旨在帮助开发者掌握如何...

    table动态添加行并编辑

    JavaScript（js）作为客户端脚本语言，使得我们能够实现表格的动态交互功能，如动态添加行、行编辑以及行数据修改。下面我们将深入探讨这些知识点。 ### 1. 动态添加行 在HTML中，`&lt;table&gt;`元素用于创建表格，但...

    javaScript动态添加Li元素的实例

    JavaScript动态添加Li元素是前端开发中常见的一项技术，可以将新的列表项（li元素）动态添加到现有的HTML文档中。在给定的文件内容中，包含了两种主要的技术实现：使用innerHTML和使用createElement。下面将对这两种...

    js动态添加行和删除行

    在JavaScript中，动态添加行和删除行是网页交互中常见的需求，特别是在表格或者列表展示数据时。这通常涉及到DOM操作，包括元素的创建、插入和移除。以下是一些关于这个主题的重要知识点： 1. DOM操作： - `...

    javascript动态添加tr节点

    本文将深入探讨如何使用JavaScript动态地向HTML表格（table）中添加`tr`（行）节点，同时结合“工具”类标签，我们可以理解这是一个关于网页开发实用技巧的主题。 首先，我们需要了解HTML表格的基本结构。一个表格...

    Html动态添加行

    JavaScript文件（在这里可能是`js`目录下的一个或多个文件）则负责处理动态添加行的逻辑。jQuery库提供了简便的API来操作DOM，例如`$(selector).append(content)`可以将新的HTML内容追加到指定的选择器后面，从而...

    javascript动态添加一行数据和删除数据

    利用javascript来结合html，可以动态的添加一行数据，和根据索引来删除一行数据。

    Javascript动态添加與刪除Talbe行

    JavaScript 动态添加与删除Table行是网页交互中常见的需求，尤其在处理表格数据时，如用户管理、订单列表等场景。以下将详细介绍如何使用JavaScript实现这一功能。 首先，我们来看如何动态插入行。有两种常见的方式...

    javascript 实现输入多行动态输入

    2. **JavaScript动态添加行**： - `tbladdrow()`函数根据当前行数生成新的行，并插入到表格中。 - 使用循环`for (i=1; i; i++)`批量添加多行。 - 提供删除行的功能`delrow()`。 3. **服务器端处理**： - 在JSP...

    JavaScript动态添加表格行（使用模板、标记）

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

    JavaScript动态操作表格，添加，删除行、列及单元格

    JavaScript动态操作表格，添加，删除行、列及单元格! 值得下载看看!资源免费,大家分享!! 更多免费资源 http://ynsky.download.csdn.net/

    javascript动态添加table

    在JavaScript中，动态添加table是一种常见的任务，尤其在构建数据驱动的Web应用时。这个功能允许开发者在用户交互或后台数据变化时实时更新页面上的表格。以下是对这一知识点的详细阐述： 1. **HTML表格基础** 在...

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