In this article I will show you how to fetch data from a table without knowing the table id or table name from a page.

It’s rather easy but when I face this problem it takes too long to resolve it.

So let’s start from HTML content. Suppose we have two table in our page we wants to traverse a particular table which doesn’t have id. The HTML content looks like:

<body onLoad=”GetTdContent();”>
<div id=”div1″>
<table border=”1″>
<tr>
<td>Name</td>
<td>Designation</td>
<td>Company Name</td>
</tr>
<tr>
<td>ABCD</td>
<td>Software Engineer</td>
<td>Microsoft</td>
</tr>
<tr>
<td>WXYZ</td>
<td>Manager</td>
<td>Oracle</td>
</tr>
<tr>
<td>PQRS</td>
<td>Salesman</td>
<td>Google</td>
</tr>
</table>
</div>
<table border=”1″>
<tr>
<td>Name</td>
<td>Designation</td>
<td>Company Name</td>
</tr>
<tr>
<td>ABC</td>
<td>Software Engineer</td>
<td>Infosys</td>
</tr>
<tr>
<td>XYZ</td>
<td>HR Manager</td>
<td>TCS</td>
</tr>
<tr>
<td>PQR</td>
<td>Salesman</td>
<td>HCL</td>
</tr>
</table>
</body>

Here we have two tables and we are calling a method(GetTdContent) on body load event. I think nothing is special here.

Now let’s go thru javascript code of this:

<script language=”javascript”>
function GetTdContent()
{
var theDivElement = document.getElementById(“div1”);
var Tables = theDivElement.getElementsByTagName(“table”);
alert(Tables.length);
var foundFlag = false;
if (theDivElement != null)
{
if(Tables.length > 0)
{
var TRs = Tables[0].getElementsByTagName(“tr”);
for (var j = 0; j < TRs.length; j++)
{
if(j == 0)
{
var TDs = TRs[j].getElementsByTagName(“td”);
var headVariable = “”;
for (var i = 0; i < TDs.length; i++)
{
headVariable += TDs[i].innerHTML + ”  “;
}
alert(headVariable + ” “);
}
else
{
var elementVariable = “”;
var TDs = TRs[j].getElementsByTagName(“td”);
for (var i = 0; i < TDs.length; i++)
{
elementVariable += TRs[j].getElementsByTagName(“td”)[i].innerHTML + ”  “;
}
alert(elementVariable);
}
}
}
}
}
</script>
That’s it.