业务需求:



在这样一个表格里,通过点击“确认”按钮,收集该行数据,向后台发送请求

解决办法

以该button为锚获取父节点,再由父节点获取各个元素的值

获取子元素又有很多办法,包括通过下标获取子元素,通过标签名获取,通过class获取等等

var root=button.parentNode.parentNode;
var name=root.getElementsByClassName("name").item(0).value
var price=root.getElementsByClassName("price").item(0).value
var nums=root.getElementsByClassName("nums").item(0).value

为每个元素生成唯一的id,从每个元素的id获取其值

后记

其实可以把每行写成一个form表单,这样的好处是不用手动再前端获取各个字段的值,缺点是主流浏览器不支持table与form嵌套,也就微软家的Edge和IE支持了

如何在HTML表格里定位到一行数据的更多相关文章

  1. Excel2010表格里设置每页打印时都有表头

    在打印Excel表格时常常会出现如果存在多页打印时,往往从第二页开始就会出现没有表头的情况,导致到后面都不清楚对应的是哪个数据,查看时也很麻烦,下面就将为大家介绍如何在Excel表格里设置每页打印时都 ...

  2. selenium webdriver 表格的定位方法练习

    selenium webdriver 表格的定位方法 html 数据准备 <html> <body> <div id="div1"> <i ...

  3. selenium之表格的定位

    浏览器网页常常会包含各类表格,自动化测试工程师可能会经常操作表格中的行,列以及某些特定的单元格,因此熟练掌握表格的定位方法是自动化测试实施过程中必要的技能. 被测试网页的HTML代码 <!DOC ...

  4. 如何在Web页面里使用高拍仪扫描上传图像

    如何在Web页面里使用高拍仪扫描上传图像 市场上所有的高拍仪都支持扫描图片并保存到本地,一般公司都会提供控件.开发人员只需要在页面集成就可以进行拍照和扫描.只不过一般扫描的图片是保存在本地固定的文件夹 ...

  5. 如何让一个json文件显示在表格里

    <body> //首先得把架子搭起来 <table id = "tb" border="1"> <tr></tr> ...

  6. 如何在Word表格中的某一栏添加背景颜色

     如何在Word表格中的某一栏添加背景颜色 编写人:CC阿爸 2014-3-14 用鼠标选中某一个单元格然后右键单击 下拉菜单选择.<边框和低纹>然后点<低纹>选项卡 选中色卡 ...

  7. vue element-ui表格里时间戳转换成时间显示

    工作中遇到后台给的表格数据里时间是一个13位的时间戳,需要转换成时间显示在表格里, 可以用element-ui表格自带的:formatter函数,来格式化表格内容: // 时间戳转换成时间 // 使用 ...

  8. 如何在 vue 项目里正确地引用 jquery 和 jquery-ui的插件

    copy内容的网址: https://segmentfault.com/a/1190000007020623 使用vue-cli构建的vue项目,webpack的配置文件是分散在很多地方的,而我们需要 ...

  9. dtgrid 手动条件删除表格中的某一行

    dtgrid 手动条件删除表格中的某一行 var grid = $.fn.DtGrid.init(dtGridOption); $(function () { grid.load(); }); fun ...

随机推荐

  1. Python的一些高级特性以及反序列化漏洞

    0x01 简述 文章主要记录一下python高级特性以及安全相关的问题 python作为脚本语言,其作为高级语言是由c语言开发的,关于python的编译和链接可以看向这里https://github. ...

  2. Java中快捷键

    Fond表示字体 size表示字号 IDEA的基本配置 IDEA中常用的快捷键 Intellij IDEA基本快捷键 Ctrl+G 跳转到指定行 Ctrl+F4 关闭当前编辑页面 Ctrl+F 搜索 ...

  3. go 【第二篇】包、变量、函数

    包 初试 每个 Go 程序都是由包组成的. 程序运行的入口是包 `main`. 这个程序使用并导入了包 "fmt" 和 `"math/rand"`. 按照惯例, ...

  4. Marshal.PtrToStringAnsi中文乱码

    出错代码: string dec = Marshal.PtrToStringAnsi(audioOutput.psz_description);//输出 鎵0鍣?(Realtek High Defi ...

  5. ubuntu 18.04 配置远程ssh/远程ftp/远程vnc登陆

    18.04相比过去采用了新的桌面,配置环境稍微有一些不同了. 首先是远程登录,windows用Tera Trem连接,ip地址得自己根据实际情况来. ubuntu上,sudo apt-get inst ...

  6. C++入门篇十二

    成员变量和成员属性: 静态成员函数和静态成员变量是不属于对象的,所以不占有空间,非静态成员是属于对象的,占有存储空间,空类大小1 #include "pch.h" #include ...

  7. 定时-thinkphp

    链接:https://pan.baidu.com/s/1wHayb9fYOiiMB3Scms0iRQ 提取码:51ex 复制这段内容后打开百度网盘手机App,操作更方便哦

  8. fidller判断只抓固定host

    设置好,填入对应的host,操作-立即运行过滤设置 效果

  9. SQL对某个字段进行排名

    SELECT ( ) AS rowno, a.badge,a.NAME,a.direct_evaluate_rate,a.view_rate FROM ( SELECT * FROM `hrs_sta ...

  10. Python 的 JPype 模块调用 Jar 包

    背景与需求 最近学习并安装使用了HttpRunner框架去尝试做接口测试,并有后续在公司推广的打算. HttpRunner由Python开发,调用接口时需要依赖Python:而大多数公司的扩展工具包使 ...