?
Solved

How do I iterate through cells of data in an html table using Java Script.

Posted on 2014-07-23
3
Medium Priority
?
181 Views
Last Modified: 2014-07-28
Hello, I know how to iterate through rows of data in an html table using Java Script. However I need to learn how to iterate through each data cell in the row. Meaning data surrounded by <td></td> tags. Can someone show me how to do this? I have the code below which iterates through rows.

var iterate = 0;

while (rowser = table.rows[iterate])
{
  iterate++;
}
0
Comment
Question by:brgdotnet
[X]
Welcome to Experts Exchange

Add your voice to the tech community where 5M+ people just like you are talking about what matters.

  • Help others & share knowledge
  • Earn cash & points
  • Learn & ask questions
3 Comments
 
LVL 35

Accepted Solution

by:
Robert Schutt earned 1000 total points
ID: 40216469
Just like a table has a property rows which holds an array of row objects, so each row object has a property cells which holds an array of cell objects. In keeping with your example you could iterate through the cells of each row like this:
var iterate = 0, rowser, celliterate, cellser, table = document.getElementById('table');

while (rowser = table.rows[iterate])
{
  celliterate = 0;
  while (cellser = rowser.cells[celliterate])
  {
    //do something with cellser for example:
    //console.log('row # ' + iterate + ', cell # ' + celliterate + ', contents: ' + cellser.innerHTML);
    celliterate++;
  }
  iterate++;
}

Open in new window

0
 
LVL 41

Assisted Solution

by:guru_sami
guru_sami earned 200 total points
ID: 40217491
You can use jquery like shown below: Sample on JsBin.

<html>
<head>
<script src="//code.jquery.com/jquery-1.9.1.min.js"></script>
  <meta charset="utf-8">
  <title>JS Bin</title>
  <script>
      $(function () {
            $("#clickme").click(function () {
                $("#table1 tr td").each(function (index) {
                    alert("td" + index + "="+$(this).html());
                });
            });
        });
  </script>
</head>
<body>
  <span id="clickme" style="color:blue;">Click Me</span>
<table id="table1">
            <tr>
                <td>One</td>
            </tr>
            <tr>
                <td>Two</td>
            </tr>
            <tr>
                <td>Three</td>
            </tr>
            <tr>
                <td>Four</td>
            </tr>
        </table>
</body>
</html>

Open in new window

0
 
LVL 2

Author Closing Comment

by:brgdotnet
ID: 40225919
Thanks, I needed a Java Script solution.
0

Featured Post

Get real performance insights from real users

Key features:
- Total Pages Views and Load times
- Top Pages Viewed and Load Times
- Real Time Site Page Build Performance
- Users’ Browser and Platform Performance
- Geographic User Breakdown
- And more

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Article by: DanRollins
This article describes a JavaScript program that creates a maze made of hexagonal cells.  In Part 2 (http://www.experts-exchange.com/Programming/Languages/Scripting/JavaScript/A_7850-Hex-Maze-Part-2.html), we'll extend the program by adding a depth-…
In Part 1 (http://www.experts-exchange.com/Programming/Languages/Scripting/JavaScript/A_7849-Hex-Maze.html) we covered the hexagonal maze basics -- how the cells are represented in a JavaScript array and how the maze is displayed.  In this part, we'…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…
Suggested Courses

770 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question