JS动态创建HTML总结

1、通过HTML对象创建

     var TableObject=new Object();

     TableObject=document.getElementbyId('TableId');

 

     var newTR=TableObject.insertRow();                                      //在Table对象中插入Tr

 

     var td0=newTR.insertCell();                                                     //在Tr对象中插入Td
     var td1=newTR.insertCell();
     var td2=newTR.insertCell();
     var td3=newTR.insertCell();

 

    td1.innerHTML='<input type="text" name="username"/>';    //放入数据

 

2、通过cloneNode(true)函数进行复制创建

     ①cloneNode（）函数的参数：true:<p>aaaa</p>;false:<p></p>

     ②通过cloneNode()函数创建对象以后通过appendChild（）函数添加到父对象中。

     ③如果克隆后，id一样，不要忘记用 setAttribute("id" , " another_id "),改变新的节点的ID。

 

3、通过函数document.createTextNode("ID")、document.createElement("p")动态创建

    ①同样创建的HTML对象添加到父对象中需通过appendChild（）函数