<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <meta http-equiv="X-UA-Compatible" content="IE=edge">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

    <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.6.4/jquery.js"></script>

    <title>test</title>

    <style>

    </style>

</head>

<body>

        <table class="my_table">

            <thead class="my_thead">

                <tr>

                    <th>编号</th>

                    <th>姓名</th>

                    <th>年龄</th>

                </tr>

            </thead>

            <tbody class="my_tbody" id="tb1">

                <tr id="1">

                    <td>001</td>

                    <td>张三</td>

                    <td>20</td>

                </tr>

                <tr>

                    <td>002</td>

                    <td>张三</td>

                    <td>20</td>

                </tr>

                <tr>

                    <td>003</td>

                    <td>张三</td>

                    <td>20</td>

                </tr>

            </tbody>

        </table>

        <button id="btn">添加</button>

        <script>

                // 删除id==1的这一行：用remove()方法

                $("#1").remove();

                // 当点击 “添加” 按钮时，给id==tb1的tbody添加一行："<tr><td>004</td><td>张三</td><td>20</td></tr>"

                $("#btn").click(function(){

                    $("#tb1").append("<tr><td>004</td><td>张三</td><td>20</td></tr>");

                });

        </script>

</body>

</html>

jquery 给表格添加或删除一行的更多相关文章

  1. 超级简单的jquery操作表格(添加/删除行、添加/删除列)

    利用jquery给指定的table添加一行.删除一行 <script language="javascript" src="./jquery.js"> ...

  2. Javascript DOM 03 表格添加、删除 + 搜索

    获取 tBodies.tHead.tFoot.rows.cells   隔行变色 鼠标移入高亮   添加.删除一行 DOM方法的使用                                   ...

  3. jQuery实现动态添加和删除一个div

    本文主要给大家简单介绍一下如何动态的在一个元素添加和删除div,希望能够得到举一反三之效. 代码实例如下: <!DOCTYPE html> <html> <head> ...

  4. jQuery如何动态添加具有删除按钮的行

    代码实例如下: <!DOCTYPE html><html><head><meta charset=" utf-8"><meta ...

  5. jQuery创建表格并实现删除

    利用jQuery创建一个简单的表格,并添加一个简单的删除按钮 <!DOCTYPE html> <html lang="en"> <head> & ...

  6. jquery 如何动态添加、删除class样式方法介绍

    获取与设置样式 获取class和设置class都可以使用attr()方法来完成.例如使用attr()方法来获取p元素的class 取与设置样式 获取class和设置class都可以使用attr()方法 ...

  7. jquery 如何动态添加、删除class样式方法介绍_jquery_脚本之家

    获取与设置样式 获取class和设置class都可以使用attr()方法来完成.例如使用attr()方法来获取p元素的class 取与设置样式 获取class和设置class都可以使用attr()方法 ...

  8. jquery 清空、添加、删除select

    $("#selectid").empty();//清空 $("#selectid").append("<option value='" ...

  9. jQuery的节点添加、删除、替换等操作

    //几种添加节点的方法 //$("p").append("<b>你好吗?</b>");//向p元素中追加<b> //$(&q ...

  10. jQuery——类的添加与删除

    添加类:addClass 删除类:removeClass 判断类是否存在:hasClass <!DOCTYPE html> <html lang="en"> ...

随机推荐

  1. Scrapy 基础入门

    0x01 框架概述 Scrapy 是基于 Python 的一个非常流行的网络爬虫框架,可以用来抓取 Web 站点并从页面中提取结构化的数据 (1)核心组件 引擎:用来控制整个系统的数据处理流程 调度器 ...

  2. 日志分析qsnctfwp

    使用工具:http Logs Viewer 使用 http Logs Viewer 载入 access.log 按照 Status 排序 其中大量 Status 为404的日志不难推断出,这是在进行目 ...

  3. aop 阶段性概况

    前言 对aop进行一个阶段性的总结. 正文 首先什么是aop呢? 那么首先看aop的解决什么样的问题. public class Program { public static void Main(s ...

  4. 【ESP32 IDF】用RMT控制 WS2812 彩色灯带

    在上一篇中,老周用 .NET Nano Framework 给大伙伴们演示了 WS2812 灯带的控制,包括用 SPI 和 红外RMT 的方式.利用 RMT 是一个很机灵的方案,不过,可能很多大伙伴对 ...

  5. nginx请求头相关漏洞修复(http host&X-XSS-Protection)

    nginx请求头相关漏洞修复(http host&X-XSS-Protection) 参考链接:Nginx常见漏洞处理 - 码农教程 (manongjc.com) Web应用漏洞-NGINX各 ...

  6. 力扣704(java&python)-二分查找（简单）

    题目: 给定一个 n 个元素有序的(升序)整型数组 nums 和一个目标值 target  ,写一个函数搜索 nums 中的 target,如果目标值存在返回下标,否则返回 -1. 示例 1: 输入: ...

  7. 力扣665(java)-非递减数列（中等）

    题目: 给你一个长度为 n 的整数数组 nums ,请你判断在 最多 改变 1 个元素的情况下,该数组能否变成一个非递减数列. 我们是这样定义一个非递减数列的: 对于数组中任意的 i (0 <= ...

  8. C# 采集知网

    采集知网 WebClient /// <summary> /// 支持 Session 和 Cookie 的 WebClient. /// </summary> public ...

  9. Jenkins 简述及其搭建

    什么是持续集成? 持续集成(CI)是在软件开发过程中自动化和集成许多团队成员的代码更改和更新的过程.在 CI 中,自动化工具在集成之前确认软件代码是有效且无错误的,这有助于检测错误并加快新版本的发布. ...

  10. C51笔记-#点灯#流水灯#延时#库函数