DOM04-动态创建元素

动态创建元素

克隆节点和添加节点

添加子元素

//需求：把p标签移到div里面
<div id=box>1</div>
<p id=son>2</p>

box.appendChild(son)//是剪切效果，不是复制

克隆节点

//clone:克隆 node：节点 deep：深度复制

son.cloneNode(true)//深度复制（标签+内容都被复制）
son.cloneNode(false)//浅度复制（仅仅是标签)
son.cloneNode//不给值的话默认为false

///克隆仅仅在内存里复制一份并没有挂到DOM树上
var clone=son.cloneNode(true);
box.appendChild(clone)//通过appendchild挂DOM树上

事件属性补充

ondblclick（双击事件）

动态创建元素的三种方式

document.write（）

特点：如果页面加载完成了再使用document.write，会把原来内面给刷掉

element.innerHTML="";

特点：
1.在内存中生成对应的对象
2.把元素原来的内容清除，把生成的对象挂到这个元素上

document.create element("tagname")

效率问题

使用element.innerHTML创建元素的时候不要放进for循环里。

需要先用数组拼好串最后再实现。

拼串

shift+tab

判断字符在字符串中的位置

element.indexOf("")

注意：
所有字符串都能匹配上""

新属性

移除子元素
removechild（"node"）