JavaScript DHTML/Table/Row

Материал из Web эксперт
Перейти к: навигация, поиск

Delete Row

   <source lang="html4strict">
   

<html> <body> <script language="JavaScript"> function function1() {

   document.all.myT.deleteRow(2);

} </script>

Row 1 Cell 1
Row 2 Cell 2
Row 3 Cell 3
Row 4 Cell 4

<input type="button" value="Remove Row 3" onclick="function1();"> </body> </html>


     </source>
   
  


Insert a Row Example

   <source lang="html4strict">
   

<html> <body> <script language="JavaScript"> function function1() {

  var myRow = document.all.myTable.insertRow();
  var myCell = myRow.insertCell();
  myCell.innerText = "The added cell"; 

} </script>

<button onclick="function1();">Add a cell</button> </body> </html>


     </source>
   
  


Move a Row Example

   <source lang="html4strict">
   

<html> <body> <script language="JavaScript"> function function1() {

   document.all.myTable.moveRow(-1, 2);

} </script>

First Row  
Second Row  
Third Row  
Fourth Row  

<button onclick="function1();">Move Row</button> </body> </html>


     </source>
   
  


"rowSpan" Example

   <source lang="html4strict">
   

<html> <body> <script language="JavaScript"> function function1() {

   document.getElementById("th1").rowSpan = 2;

} function function2() {

   location.reload();

} </script>

Cell 1 Cell 2 Cell 3
Cell 4 Cell 5 Cell 6
Cell 7 Cell 8 Cell 9
Cell 10 Cell 11 Cell 12

<input type="button" value="Span(2) Cell 1" onClick="function1();"> <input type="button" value="Restore" onClick="function2();"> </body> </html>


     </source>
   
  


Table row Index

   <source lang="html4strict">
   

<script language="JavaScript">

   function function1(elem) {
       var m = elem.rowIndex; 
       alert("Row Index: "+m);
   }

</script>

Row 1
Row 2
Row 3
Row 4


     </source>
   
  


Table section Row Index

   <source lang="html4strict">
   

<html> <body> <script language="JavaScript"> function function1(elem) {

   var m = elem.sectionRowIndex;
   alert("The zero-based row index is: "+m); 

} </script>

Row 1
Row 2
Row 3
Row 4

</body> </html>


     </source>