JS动态创建元素

动态创建元素的三种方法：

第一种document.write("")

document.write("<input type=‘text’>  value=‘456‘>");

相当于创建了一个默认名是456的输入框

function f1(){
        document.write("<input type=‘text‘ value=‘999999‘>");
    }

但是当document.write("")写在函数中时，会冲刷掉之前的页面元素，之前的document都不显示，所以少用或者不用document.write("")创建元素

第二种innerHTML创建元素

要注意尽量不要频繁的拼接字符串

div.innerHTML+="<input type=‘text‘ value=‘999999‘>";

字符串具有不可变性，会重复开辟内存空间，要注意优化

优化版本就是放在数组中

第三种document.createElement

var ul = document.createElement("ul");

移除节点

var ul = document.createElement("ul");

在前面插入节点

insertBefore

var n1 = lis[2].cloneNode(true);

ul.insertBefore(n1,lis[0]);                 第一个参数是要插入的节点，第二个参数是插入的位置

两个键盘事件：

 onkeydown: 鼠标按下时触发，不会获得当前输入的内容

 onkeyup ：键盘按下并抬起时才触发，会获得输入的内容