js&jquery获取指定table指定行里面的内容
CreateTime--2018年5月18日11:46:04
Author:Marydon
1.展示
代码展示
1 <table style="border:0;"> 2 ????<tr><td style="border:0;">test</td></tr> 3 </table> 4 <table> 5 ????<tr> 6 ????????<td>第一行第一列</td> 7 ????????<td>第一行第二列</td> 8 ????????<td>第一行第三列</td> 9 ????????<td>第一行第四列</td>10 ????</tr>11 ????<tr>12 ????????<td>第二行第一列</td>13 ????????<td><input type="text" value="2-1"/></td>14 ????????<td><input type="text" value="2-2"/></td>15 ????????<td><input type="text" value="2-3"/></td>16 ????</tr>17 ????<tr>18 ????????<td>第三行第一列</td>19 ????????<td><input type="text" value="3-1"/></td>20 ????????<td><input type="text" value="3-2"/></td>21 ????????<td><input type="text" value="3-3"/></td>22 ????</tr>23 </table>
页面展示
说明：test也是一个table
2.实现
举例：获取第二个table第二行里面所有的文本框
1 $(function(){2 ????$("table:eq(1) tr:eq(1) input:text").each(function(){3 ????????console.log($(this).val());4 ????});5 });3.拓展
需求：
为table中的每个文本框，添加name属性；
???????????????? name命名规则：该文本框所在单元格的所在行的行名称+"_"+"列名称"+"_"+列数
实现：2种方式
$(function(){ ???????// 获取第二个table的所有行对象 ???var table2_rows = document.getElementsByTagName("table")[1].rows; ???// 获取第二个table的所有行数 ???var table2_rows_length = table2_rows.length; ???// 获取第一行所有的列数据 ???var table2_rows1_columns_array = []; ???????// 获取第一行所有的列对象，注意：返回的不是一个数组 ???var table2_rows1_columns = table2_rows[0].cells; ???// 对第一行进行遍历 ???for (var i = 0; i < table2_rows1_columns.length; i++) { ???????// 将该单元格的文本信息放到数据中 ???????table2_rows1_columns_array.push(table2_rows1_columns[i].innerText); ???} ???????// 当前行的第一列名称 ???var table2_rows_column1 = ""; ???????// 方式一 ???// 去除第一行 ???/*for(var i= 1; i < table2_rows_length; i++) { ???????// 错误用法：$(table2_rows[i] + " td").each(){} ???????$(table2_rows[i]).children("td").each(function(index,tdObj) { ???????????var index_td = index; ???????????// 取当前行的第一列 ???????????if (0 == index_td) { ???????????????table2_rows_column1 = $(tdObj).text(); ???????????} ???????????// 获取当前单元格内的所有文本框 ???????????$(tdObj).children(":text").each(function() { ???????????????$(this)[0].name = table2_rows_column1 + "_" + table2_rows1_columns_array[index_td] + "_" + index_td; ???????????}); ???????}); ???}*/ ???????// 方式二 ???// 去除第一行 ???$("table:eq(1) tr:gt(0)").each(function(index,trObj){ ???????// 获取当前行的所有td对象 ???????// 错误用法：$(trObj + " td") ???????$(trObj).children("td").each(function(index, tdObj){ ???????????var index_td = index; ???????????// 取当前行的第一列 ???????????if (0 == index_td) { ???????????????table2_rows_column1 = $(tdObj).text(); ???????????} ???????????// 获取当前单元格内的所有文本框 ???????????$(tdObj).children("input:text").each(function(index, inputObj){ ???????????????$(inputObj)[0].name = table2_rows_column1 + "_" + table2_rows1_columns_array[index_td] + "_" + index_td; ???????????}); ???????}); ???????????????????});});相关推荐：
- 类似文章
js&jquery获取指定table指定行里面的内容
原文地址：https://www.cnblogs.com/Marydon20170307/p/9055560.html