How to add cells dynamically!!
Copy Code code as follows:
Using the InsertRow () and Insertcell () method
Its usage is as follows:
InsertRow ()
Copy Code code as follows:
var newtr=tableobj.insertrow (N);
Copy Code code as follows:
where n means to insert into the first row!
Description: When n=0, insert to the top line! When the n=-1 is inserted into the last line, the argument is omitted fairly!
InsertCell ()
Copy Code code as follows:
var Newtd=trobj.insertcell (N);
where n means to insert into the first few columns!
Description: When n=0, insert to the top line! When the n=-1 is inserted into the last line, the argument is omitted fairly!
The following is an instance code:
Copy Code code as follows:
<script language= "JavaScript" >
var count=false,no=1;
function AddRow () {
count=! Count;
Add a row
var newtr = Testtbl.insertrow ();
Add three columns
var newTd0 = Newtr.insertcell ();
var newTd1 = Newtr.insertcell ();
var newTd2 = Newtr.insertcell ();
Set column contents and properties
if (Count) {newtr.style.background= "#FFE1FF";}
else {newtr.style.background= "#FFEFD5";}
newtd0.innerhtml = ' <input type=checkbox id= ' box4 ' > ';
no++
Newtd1.innertext= "the first" + no+ "line";
}
</script>
<! DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 transitional//en" "Http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd "> <ptml xmlns=" http://www.w3.org/1999/xhtml "> <pead> <meta http-equiv=" Content-type "content=" text/html; charset=gb2312 "/> <title> Blu-ray-blueshine</title> <script language=" JavaScript "> var count=false, No=1; function AddRow () {count=! Count; Add a row of var newtr = Testtbl.insertrow (); Add two columns var newTd0 = Newtr.insertcell (); var newTd1 = Newtr.insertcell (); var newTd2 = Newtr.insertcell (); Set column content and property if (Count) {newtr.style.background= ' #FFE1FF ';} else {newtr.style.background= "#FFEFD5";} newtd0.innerhtml = ' <input type=checkbox id= ' box4 ' > '; no++ newtd1.innertext= "The first" + no+ "line"; } </script> </pead> <body> <table width= "399" border=0 cellspacing= "1" id= "Testtbl" > < TR bgcolor= "#FFEFD5" > <td width=6%><input type=checkbox id= "box1" ></td> <td > 1th line </td&Gt <td > </td> </tr> </table> <label> <input type= "button" value= "Insert Row" onclick= "AddRow () "/> </label> </body> </ptml>
[Ctrl + A All SELECT Note: If the need to introduce external JS need to refresh to perform]