javascript cloneNode()方法的使用

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title>控件cloneNode（）方法的使用</title> <script type="text/javascript"><!-- var i = 1; function AddRow() { var IsInsert = true; var tableObject; tableObject = document.getElementById('CloneNodeShow'); //如果没有填充值,那么isneed 就为空！ for (var j = 0; j < tableObject.getElementsByTagName("input").length; j++) { var inputs = tableObject.getElementsByTagName("input")[j]; if (inputs.type == "text" && inputs.value == "") { isneed = false; } } //如果已经填充值了就创建TR,td if (IsInsert == true) { //根据table创建一个Row var CopyTr = tableObject.insertRow(); //创建单元格 var td0 = CopyTr.insertCell(); var td1 = CopyTr.insertCell(); var td2 = CopyTr.insertCell(); var td3 = CopyTr.insertCell(); //第一个单元格的值为:++i.注意i为全局变量 td0.innerHTML = (++i) + '.'; //td1的值为: td1.innerHTML = "<input type='text' name='username'/>"; //用cloneNode永久克隆(true标示克隆) var NewSelect = document.getElementById("sexType").cloneNode(true); NewSelect.id = "sexType" + i; //td2的值为NewSelect td2.appendChild(NewSelect); td3.innerHTML = '<input type="text" name="age" onchange="AddRow()"/>'; } } // --></script> </head> <body> <table id="CloneNodeShow" border="1" bordercolor="#000000"> <tr> <th></th><th>姓名</th><th>性别</th><th>年龄</th> </tr> <tr> <td>1.</td> <td><input type="text" name="username"/></td> <td> <select name="sexType" id="sexType"> <option value="%">请选择性别</option> <option value="0">男</option> <option value="1">女</option> </select> </td> <td><input type="text" name="age" onchange="AddRow()"/></td> </tr> </table> </body> </html>
[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]