首页 > 其他分享 >html_table获取当前数据

html_table获取当前数据

时间:2023-04-09 15:56:35浏览次数:40  
标签:tableHeadFileds 获取 tableHeadId html filed table row

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<table border="1px">
    <tr id="filed">
        <td id="id">ID</td>
        <td id="title">标题</td>
        <td id="category">类型</td>
        <td>操作</td>
    </tr>
    <tr>
        <td>1</td>
        <td>一起去看流星雨</td>
        <td>综艺</td>
        <td>
            <button onclick="del(this,'id')">删除(获取id)</button>
        </td>
    </tr>
    <tr>
        <td>2</td>
        <td>孤勇者</td>
        <td>激情</td>
        <td>
            <button onclick="del(this,'title')">删除(获取title)</button>
        </td>
    </tr>

</table>
</body>
<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<script>

    function del(row, filed) {
        var tableHeadId = "#filed";
		console.log(row);
        console.log(getCurrentRowFiledValue(row, filed, tableHeadId));
    }

    //row,当前行的this对象.filed,需要获取的字段值.tableHeadId,table表头行row的ID值.
    function getCurrentRowFiledValue(row, filed, tableHeadId) {
        //获取table表头所有td
        var fileds = $(tableHeadId).children();
        //记录表头中所有的字段
        var tableHeadFileds = [];
        //  长度-1,是减去操作列.
        for (let i = 0; i < fileds.length - 1; i++) {
            tableHeadFileds.push(fileds[i].id)
        }
        //找到当前行,指定的字段值.
        for (let i = 0; i < tableHeadFileds.length; i++) {
            if (tableHeadFileds[i] == filed) {
                //返回当前行的指定字段值.
                return $(row).parent().parent().children()[i].innerHTML;
            }
        }
    }
</script>
</html>

  

标签:tableHeadFileds,获取,tableHeadId,html,filed,table,row
From: https://www.cnblogs.com/leochan007/p/17300428.html

相关文章

  • 【前端工具类】003-实时获取鼠标位置的工具类:useMousePosition
    【前端工具类】003-实时获取鼠标位置的工具类:useMousePosition文章目录【前端工具类】003-实时获取鼠标位置的工具类:useMousePosition一、Vue3usexxx写法1、代码2、使用示例一、Vue3usexxx写法1、代码import{ref,onMounted,onUnmounted}from"vue";exportfunctionuse......
  • glibc GDBusInterfaceVTable
    staticconstGDBusInterfaceVTableboo_vtable={NULL,/*_method_call*/NULL,/*_get_property*/NULL/*_set_property*/};/***GDBusInterfaceVTable:*@method_call:Functionforhandlingincomingmethodcalls.*@get_property:Function......
  • html页面里面的button标签使用@click属性时,无法定位到Vue的method里面
    问题解决就很离谱,都是按照网上的教程来的,一直无法定位,之后跟着加上了div标签,加上了id属性,方法还是灰白色,调用不了;后来直接将el属性名称更改掉了,没想到这样就成功识别到了,反正就是逻辑没有出问题,最后也达到期望值了。......
  • mac m1安装stable-diffusion-webui
    1.准备安装环境[email protected]下载stable-diffusion-webuigitclonehttps://github.com/AUTOMATIC1111/stable-diffusion-webui.git3.下载huggingface模型https://huggingface.co/runwayml/stable-diffusi......
  • Golang反射获取变量类型和值
    Golang反射获取变量类型和值 1.什么是反射反射是程序在运行期间获取变量的类型和值、或者执行变量的方法的能力。Golang反射包中有两对非常重要的函数和类型,两个函数分别是:reflect.TypeOf能获取类型信息reflect.Type;reflect.ValueOf 能获取数据的运行时表示reflect.Val......
  • 关于 iptables 的理解
    虽然对防火墙不了解,但是感觉很牛逼的样子。                        另一个网页上查到的知识:                                  ......
  • Python Pandas pivot_table 透视表 计数
    pivot_table函数pivot_table(data=表格,index=行,columns=列,values=值,aggfunc=计数函数,margins=True#汇总统计)aggfunc调用函数,不带括号不带括号时,调用的是这个函数本身,是一个函数对象带括号时,调用的是函数的执行结果透视表中......
  • Jmeter压测生成多维度图形化HTML测试报告讲解
     Jmeter压测生成多维度图形化HTML测试报告讲解dashboard讲解TestandReportinformationsSourcefile:jtl文件名StartTime:压测开始时间EndTime:压测结束时间Filterfordisplay:过滤器Lable:sampler采样器名称APDEX(ApplicationperformanceIndex)apdex:应......
  • 面试题百日百刷-HBase中HTable API有没有线程安全问题,在程序是单例还是多例?
    锁屏面试题百日百刷,每个工作日坚持更新面试题。请看到最后就能获取你想要的,接下来的是今日的面试题: 1.HBase内部机制是什么?Hbase是一个能适应联机业务的数据库系统物理存储:hbase的持久化数据是将数据存储在HDFS上。存储管理:一个表是划分为很多region的,这些region分布式地......
  • OpenCV获取相机旋转矩阵和平移矩阵
    想要求解旋转矩阵和平移矩阵,先要了解相机内参矩阵和畸变矩阵如何获取,不了解的可以先移步https://www.cnblogs.com/nobodyx/p/17297074.html先上代码#include<iostream>#include<vector>#include<glob.h>#include<opencv2/opencv.hpp>intmain(){//使用glob库......