Getting td value for tr

Question

I have code in the following style:

<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>

I have jQuery where I get the identifier of each row, and now I want to get every value in every td for every row. How to do it?

 var tbl = document.getElementById("tbl-1");

    var numRows = tbl.rows.length;

    for (var i = 1; i < numRows; i++) {

        var ID = tbl.rows[i].id;

Answer 1

in jQuery:

$("table#tbl-1 tr").each(function( i ) {
  $("td", this).each(function( j ) {
    console.log("".concat("row: ", i, ", col: ", j, ", value: ", $(this).text()));
  });
});

Here you can check it out: http://jsfiddle.net/3kWNh/

Answer 2

Your code is not like jQuery. Are you sure you are not using the term jQuery as a synonym for JavaScript? :) If so, I suggest you read this question ; this will make things much more understandable to you.

Anyway, here comes the 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 just make
        // it SUPER-obvious  that it works :)
        alert(cells[ic].innerHTML);
    }
}

Alternatively, if you are really using 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'

Answer 3

td

, value, HTML HTML ? "HTML", "HTML ", ( ) " value". :

jQuery:

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 - , , ( , , /).

---

Off-

• , HTML, , "" W3C, td value. data-* .
• , id . id, . HTML5, HTML CSS. jQuery CSS, CSS, CSS. ( : d seomthing.)

Answer 4

$("td","#tbl-1").each(function(){
//access the value as
 $(this).html()

});

Answer 5

<td>

$('#tbl-1 td').each(function() {
  // do stuff for each td in here...
  alert($(this).html());
})

: jQuery, - JavaScript.

Answer 6

What you use there is not jQuery, if you use jQuery you can use .html();to extract the values.

Here is your jQuery code:

$('#tbl-1 td').each(function(){

    var ID    = $(this).attr('id');
    var value = $(this).html();

});