<html>
<head>
<script type="text/javascript">
function getInnerHTML()
{
alert(document.getElementById("tr2").innerHTML);
}

function insCell()
  {
  var x=document.getElementById('tr2').insertCell(0)
  x.innerHTML="Table Row, Table Cell"
  }

function delCell()
  {
  document.getElementById('tr2').deleteCell(0)
  }

function deleteCaption()
  {
  document.getElementById('myTable').deleteCaption()
  }

function createCaption()
{
var x=document.getElementById('myTable').createCaption()
x.innerHTML="My Table"
}

function delRow()
{
document.getElementById('myTable').deleteRow(0)
}

function insRow()
{
var x=document.getElementById('myTable').insertRow(0);
var y=x.insertCell(0);
var z=x.insertCell(1);
y.innerHTML="New Cell 1";
z.innerHTML="New Cell 2";
}
</script>
</head>
<body>
<center><table id="myTable" border="1">
<tr id="tr2">
<td>Row1 cell1</td>
<td>Row1 cell2</td>
</tr>
<tr id="tr2">
<td>Row2 cell1</td>
<td>Row2 cell2</td>
</tr>
<tr id="tr2">
<td>Row3 cell1</td>
<td>Row3 cell2</td>
</tr>
</table>
<br />
<center><table border="0">
<tr><th colspan="2">Table Controler</th></tr>
<tr><td><center><input type="button" onclick="createCaption()" value="Create caption"></td><td><center><input type="button" onclick="deleteCaption()"
value="Delete caption" /></td></tr>
<tr><td colspan="2"><center><input type="button" onclick="getInnerHTML()" value="    Alert innerHTML of table row    " /></td></tr>
<tr><td><center><input type="button" onclick="insRow()" value="   Insert row    "></td><td><center><input type="button" onclick="delRow()"
value="Delete first row"></td></tr>
<tr><td><center><input type="button" onclick="insCell()" value="   Insert cell   "></td><td><center><input type="button" onclick="delCell()" value="   Delete cell   "></td></tr>
</table>
</body>
</html>
2
Contributors
1
Reply
2
Views
8 Years
Discussion Span
Last Post by Jonh S. Brown
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.