得到每tr的td值
getting td value per tr
我有以下样式的代码:
<tr id="201461">
<td id="0A" style="cursor:pointer" onClick = "ProcessTextBoxClick()" value="Feb 23 2008">Feb 23 2008</td>
<td id="0B" style="cursor:pointer" onClick = "ProcessTextBoxClick()" value="Feb 25 2008">Feb 25 2008</td>
<td id="0C" style="cursor:pointer" onClick = "ProcessTextBoxClick()" value="Feb 28 2008">Feb 28 2008</td></tr><tr id="201460">
<td id="1A" style="cursor:pointer" onClick = "ProcessTextBoxClick()" value="47">47</td></tr>
我有一些JQuery,我得到每一行的id,现在我想得到每一行的每个td的每个值。我该怎么做呢?
var tbl = document.getElementById("tbl-1");
var numRows = tbl.rows.length;
for (var i = 1; i < numRows; i++) {
var ID = tbl.rows[i].id;
您的代码看起来不像jQuery。你确定你没有使用术语jQuery作为JavaScript的同义词吗?如果是这样的话,我建议你也看看这个问题;这会让你更清楚。
不管怎样,JavaScript是这样的:
var tbl = document.getElementById("tbl-1");
var numRows = tbl.rows.length;
for (var i = 1; i < numRows; i++) {
var ID = tbl.rows[i].id;
var cells = tbl.rows[i].getElementsByTagName('td');
for (var ic=0,it=cells.length;ic<it;ic++) {
// alert the table cell contents
// you probably do not want to do this, but let's just make
// it SUPER-obvious that it works :)
alert(cells[ic].innerHTML);
}
}
或者,如果你真的使用jQuery:
var table = $('#tbl-1').
var rowIds = [];
var cells = [];
$('tr', table).each(function() {
rowIds.push($(this).attr('id'));
$('td', $(this)).each(function() {
cells.push($(this).html());
});
});
// you now have all row ids stores in the array 'rowIds'
// and have all the cell contents stored in 'cells'
jQuery:
$("table#tbl-1 tr").each(function( i ) {
$("td", this).each(function( j ) {
console.log("".concat("row: ", i, ", col: ", j, ", value: ", $(this).text()));
});
});
您可以在这里查看工作:http://jsfiddle.net/3kWNh/
我想获得每个td中的每个值
您想要去掉标记的value
属性值、HTML还是HTML ?到目前为止,各种各样的答案大多与"HTML"有关,至少有一个与"剥离标记的HTML"有关,但没有一个(到目前为止)与"value
属性的值"有关。所以:
var valuesByRowID = {};
$("#tbl-1 tr").each(function() {
valuesByRowID[this.id] = $(this).find("> td").map(function() {
// Option 1: Getting the value of the `value` attribute:
return this.getAttribute("value"); // or return $(this).attr("value");
// Option 2: Getting the HTML of the `td`:
return this.innerHTML;
// Option 3: Getting the HTML of the `td` with markup stripped:
return $(this).text();
}).get();
});
最终结果是每个行都有属性的对象,属性名是该行的id
值,属性值是td
信息的数组。
例如,要获取行201461
的数组,可以这样做:
var data = valuesByRowID["201461"]; // Note that property names are strings
var index;
for (index = 0; index < data.length; ++index) {
alert(data[index]);
}
上面使用:
-
$()
查找表中的行。 -
map
(后跟get
)构建值数组。 一个简单的JavaScript对象来保存结果。JavaScript对象本质上是映射(又名字典,又名关联数组,又名名称/值对集合)。
八卦:
- 正如我在对这个问题的评论中提到的,你列出的HTML在W3C术语中是"无效的",
td
元素没有value
属性。你可以考虑使用data-*
属性。 - 正如Spudley在对这个问题的评论中指出的那样,这些
id
值可能会给你带来麻烦。建议而不是的id
值以数字开头。虽然在HTML5中有效,但在早期版本的HTML和CSS中无效。由于jQuery使用CSS选择器,如果您正在使用CSS,我强烈建议您遵守CSS规则。(在你的情况下,这真的很容易:只要在他们的前面放一个d
或其他东西。)
你可以直接做
$("td","#tbl-1").each(function(){
//access the value as
$(this).html()
});
您使用的不是jQuery,如果您使用jQuery,您可以使用.html();
来检索值
$('#tbl-1 td').each(function(){
var ID = $(this).attr('id');
var value = $(this).html();
});
如果你想遍历所有的<td>
$('#tbl-1 td').each(function() {
// do stuff for each td in here...
alert($(this).html());
})
注意:这是jQuery,而你的例子是原生JavaScript。
相关文章:
- 在同一tr-jQuery中获取td的值
- jQuery将输入集中在下一个tr->td时,td包含一个输入字段,但从不关注html选择
- 使用动态变量从tr访问子td
- 在 jquery 中的 TR 中查找 td 的所有输入
- jQuery选择器,用于查找包含具有特定值的TD输入的TR
- 防止隐藏的 tr 破坏 td 宽度
- focus Using Jquery <tr> <td>
- 如何在选定的 tr 对象中选择 td
- 根据TD类别隐藏TR
- 访问特定<td>对于给定<tr>以及更改html
- 如何在点击tr的td后获取tr的id's元素
- 使用js:order<创建表时出现问题;tr>并且<td>
- 正在获取循环中td元素的tr id
- 我如何在AJAX中循环数据并在其中存储特定值's各自的tr td
- jquery:将TR移动到新移动的TD
- 获取动态值 tr jquery 的每个 td 值
- 使用jQuery从TR父级中选择第一个TD子级
- Jquery:选择tr元素的第二个td
- 选择具有动态 ID 的特定 tr 的特定 td
- 如何使表格td tr根据文本长度自动宽度