我想通过遍历它们来设置表的所有单元格的值.
理想情况下,我想访问像数组一样的 Html表,即$(“#tbl”)[row] [col] =“5”
理想情况下,我想访问像数组一样的 Html表,即$(“#tbl”)[row] [col] =“5”
这不起作用.
$(document).ready(function() { for (var row = 0; row < 3; row++) { for (var col = 0; col < 3; col++) { $("#tbl").children().children()[row].children()[col].append("sdfasdf"); } } });
这有效,但我不知道为什么!
>我不理解$(“#tbl”).children().children()为什么需要第二个孩子
>为什么第3个孩子不是第2个孩子的功能,即孩子().
>为什么innerHTML不是函数,即innerHTML()
$(document).ready(function() { for (var row = 0; row < 3; row++) { for (var col = 0; col < 3; col++) { $("#tbl").children().children()[row].children[col].innerHTML = "H!"; } } });
解决方法
如果您只想迭代表中的每个单元格,则以下任一操作都可以:
$('#tbl td').each(function () { var $cell = $(this); // do something with the current <td> }); // or,$('#tbl tr').each(function () { var $row = $(this); $row.children().each(function () { var $cell = $(this); // do something with the current <tr> and <td> }); });
如果你想像数组一样访问表,你将不得不自己构建一个数组:
var arr = $('#tbl > tbody > tr').map(function () { return $(this).children().map(function () { return $(this); }); });
但是,jQuery不公开API,因此你可以(永远)能够进行简单的赋值,就像在arr [row] [col] = 5;中一样.使用上面的数组,这将工作:
arr[row][col].text(5);
编辑
(1) I dont understand $(“#tbl”).children().children() why the need for the 2nd children
因为jQuery的.children()函数只返回一组元素的直接后代,而不是所有后代(例如子孙子……).
(2) Why is the 3rd children not a function i.e. children() like the 1st 2.
因为当您使用数组表示法来访问jQuery集合的元素时,您将获得底层DOM元素,而不是jQuery对象.使用.eq(i)
而不是[i]:
$("#tbl").children().children().eq(row).children().eq(col).append("sdfasdf");
(3) Why is’nt innerHTML not a function i.e. innerHTML()
在问题#2的答案中,… children()[col]返回一个DOM元素,而不是jQuery对象.大多数浏览器都支持DOM element.innerHTML
property.