通过当前this取table中行的所有数据

最新推荐文章于 2022-06-21 04:42:16 发布
最新推荐文章于 2022-06-21 04:42:16 发布
阅读量1.4k 收藏
点赞数
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/nbdota/article/details/53508843
版权

οnclick="delete(this);"

function delete (cell) {

  var row=cell.parentNode.parentNode.parentNode;
  var orderCode=row.cells[0].innerText;
  var versionNo=row.cells[1].innerText;

}

使用parentNode总会取到你要的当前行。

row下面的td使用cell【i】来取得

1号位为：

<td style="display:none"> 隐藏text



Mr_苏
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
获取el-table表格中选中行的数据
07-31
获取el-table表格中选中行的数据
JS通过点击/选择表格某一行的获取当前行的数据（结尾有VUE思路）
测试领域专家，多领域测试技术、管理、工具都略懂，略懂一二
01-28 2万+
问题一：当我们在表格中会有以下点击按钮，然后获取该行的某列信息； 在 修改按钮 上设置 οnclick="edit(this)" function edit(val){ //这里就是val，别以为写错了，如果写成this会报错：Uncaught SyntaxError: Unexpected token 'this'，这是转过来的参数值的意思 var value = $(val).parent().parent().find("td"); ...
原生js this.pareantNode undefined
weixin_42313854的博客
01-22 518
http://cn.voidcc.com/question/p-butgeiqh-bdz.html html里 <div class="selection left" onclick="select_entity_class(this)">选择实体类型</div> js里 function select_entity_class(s) { console.log(s.parentNode); } 即可获取parentNode信息。 ...
js -parentNode、offsetParent父节点
qq_35187942的博客
01-05 470
 &lt;!DOCTYPE html&gt; &lt;html&gt;     &lt;head&gt;         &lt;meta charset="{CHARSET}"&gt;         &lt;title&gt;&lt;/title&gt;         &lt;script&gt;             window.onload = function(
JavaScriptAPI编程_获取元素_节点操作
热门推荐
JiuMeilove的博客
06-21 2万+
JavaScript获取元素的方式大致有两种 这两种方法都能获取到元素,但是节点操作更简单更有逻辑性网页中所有内容都是节点(标签,属性,文本,注释等),在DOM中,节点使用node来表示. HTML DOM树中的所有节点均可通过JavaScript进行访问,所有HTML元素(节点)均可被修改,也可以创建或删除. 一般而言,节点至少拥有nodeType(节点类型),nodeName(节点名称),和nodeValue(节点值)这三个基本属性示例 示例 示例 parentNode.children（非标准）
vue中，el-table表格中点击详情按钮，获取当前行数据并进行跳转 & this.$router.push跳转页面和this.$route.params获取数据
weixin_44867717的博客
06-05 7203
表格
Bootstrap table表格初始化表格数据的方法
10-18
服务器端分页（`sidePagination: 'server'`）意味着表格将发送请求到服务器，请求参数包括当前页码、每页大小等，服务器返回对应的数据。客户端分页则是在本地处理数据，适用于数据量较小的情况。 `showExport: ...
layui-table获得当前行的上/下一行数据的例子
12-13
此方法主要是获得Layui当前行数据的上一行数据，或者下一行数据,os旧的jquery选择器 se选择器 nse新的jquery选择器 /** * * @param obj layui-table的行数据对象 * @param number 要查找的行距离当前行距离，以...
基于jQuery获取table数据发送到后端
10-15
在添加功能的基础上，我们需要实现“保存”按钮的功能，即当用户点击“保存”按钮时，获取表格中的所有数据，并以JSON格式发送到后端。这通常通过AJAX的POST请求实现，使用jQuery库简化这个过程： ```javascript $...
jquery获取table指定行和列的数据方法(当前选中行、列)
01-21
今日项目中需要用到取table选中列的数据，网上资料发现都不能获取到选中指定列的数据，通过分析测试后总结出以上代码，可以获取选中行/列的数据。取td的数据不是.val()，也不是.html()。经过多次测试才发现是通过...
this.parentNode.parentNode
AI开源工具分享
11-05 3112
▼     父节点的父节点，比如有这样一段 HTML:          Click="deleteMe(this.parentNode.parentNode);">               这样的话，那里面的this.parentNode就是divB,而this.parentNode
js 操作表格-单元格和行
weixin_43294560的博客
11-08 375
表格的修改 获取行对象,每个行中的单元格都有索引 var tr=btn.parentNode.parentNode; 获取单元格数组,操作索引来操作单元格 行对象.cells[3] 代码示例: <html> <head> <title>js 操作表格</title> <meta charset="utf-8"/> ...
table中选择一行使用"this"操作
piao0wwy的博客
06-06 704
<input type="radio" name="eachCheck" onclick='check(this)'/> ${product.brand_name } ${product.brand_logo_url } ${product.id }
js--table表格操作
you些话的博客
12-11 956
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title></title> <style type="text/css"> body{ text-align: center; } /*设置表格居中*/ #ta{ margin: auto; } /*设置表格的行样式*/ #ta tr{ .
jquery点击事件获取table行号、列号
12-07 2万+
tabel点击行，获取行号 $('#table tbody').on( 'click', 'tr', function (e) { var index = $(this).parent().context._DT_RowIndex; //行号 var rows = table.rows( index ).data();//获取行数据 }); tabel点击td，获取行号和列号
vue 自定义jq的tabledata表格插件的分页条
lixiwoaini的博客
12-28 1387
我们在使用tabledata表格插件的时候，如果我们将每页的显示总数大于页面显示条数的时候，这时我们的分页及相关信息就会看不见，希望分页条可以浮动在某一个地方，因此工程决定自定义vue标签去实现此功能。 效果图： 本组件的思路是自定义一个vue的标签，然后根据各个需要的table页面去适配，具体代码和使用方法如下： 1.index.vue ...
react中从表格外部onClick获取当前table的所有数据
最新发布
05-27
要从表格外部的`onClick`事件中获取当前表格的所有数据，可以采用以下步骤： 1. 在表格组件中，创建一个`ref`引用，用于获取表格的DOM节点： ```jsx import React, { useRef } from "react"; function Table() { const tableRef = useRef(null); return ( <table ref={tableRef}> {/* 表格内容 */} </table> ); } ``` 2. 在点击事件处理函数中，通过`tableRef.current`获取表格DOM节点，再通过`querySelectorAll`方法获取所有的`<tr>`元素： ```jsx function handleClick() { const rows = tableRef.current.querySelectorAll("tr"); console.log(rows); } function Table() { const tableRef = useRef(null); return ( <div> <button onClick={handleClick}>获取表格数据</button> <table ref={tableRef}> {/* 表格内容 */} </table> </div> ); } ``` 3. 遍历`<tr>`元素，获取每行的数据： ```jsx function handleClick() { const rows = tableRef.current.querySelectorAll("tr"); const data = []; rows.forEach((row) => { const rowData = []; row.querySelectorAll("td").forEach((cell) => { rowData.push(cell.textContent); }); data.push(rowData); }); console.log(data); } ``` 完整代码如下： ```jsx import React, { useRef } from "react"; function Table() { const tableRef = useRef(null); function handleClick() { const rows = tableRef.current.querySelectorAll("tr"); const data = []; rows.forEach((row) => { const rowData = []; row.querySelectorAll("td").forEach((cell) => { rowData.push(cell.textContent); }); data.push(rowData); }); console.log(data); } return ( <div> <button onClick={handleClick}>获取表格数据</button> <table ref={tableRef}> <thead> <tr> <th>姓名</th> <th>年龄</th> </tr> </thead> <tbody> <tr> <td>张三</td> <td>20</td> </tr> <tr> <td>李四</td> <td>25</td> </tr> </tbody> </table> </div> ); } ```

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值