| When you need to compare two tables on web page, you can simply read the content with innerHTML tag easily. But you need to analyze the table content. Following is the simple example to analyze two table content.
<script lanugage="text/javascript">
function CompareTables(table1,table2)
{
var instHasChange = false;
for(var i=0; i < table1.rows.length; i++)
{
var changes =RowExists(table2,table1.rows[i].cells[0].innerHTML,table1.rows[i].cells[1].innerHTML);
if(!changes[0])
{
table1.rows[i].style.backgroundColor = "red";
instHasChange = true;
}
else if(changes[1])
{
table1.rows[i].style.backgroundColor = "orange";
instHasChange = true;
}
}
for(var i=0; i < table2.rows.length; i++)
{
var changes = RowExists(table1,table2.rows[i].cells[0].innerHTML,table2.rows[i].cells[1].innerHTML);
if(!changes[0])
{
table2.rows[i].style.backgroundColor = "#00CC33";
instHasChange = true;
}
else if(changes[1])
{
table2.rows[i].style.backgroundColor = "orange";
instHasChange = true;
}
}
return instHasChange;
}
function RowExists(table,columnName,columnValue)
{
var hasColumnOrChange = new Array(2);
hasColumnOrChange[0] = false;
hasColumnOrChange[1] = false;
for(var i=0; i < table.rows.length; i++)
{
if(table.rows[i].cells[0].innerHTML == columnName)
{
hasColumnOrChange[0] = true;
if(table.rows[i].cells[1].innerHTML != columnValue)
hasColumnOrChange[1] = true;
}
}
return hasColumnOrChange;
}
</script>
| 
