节点查找方法
**
- document.getElementById()
获取id名 - document.getElementsByName()
获取类名或id名 - document.getElementsByTagName()
获取标签名 - Ele.getElementsByClassName()
获取类名 - Ele.querySelector()
返回文档中匹配制定css选择器的一个元素 - Ele.querySelectorAll()
返回文档中匹配制定css选择器的一组元素**
操作节点方法
**
- appendChild()
为指定元素节点的最后一个子节点之后添加节点,该方法返回新的子节点。 ul.appendChild(li4); - insertBefore()
在指定的已有子节点之前插入新的子节点 ul.insertBefore(linew, li2); - replaceChild()
该方法用新节点替换某个子节点
两个参数:
-replaceChild(要插入的节点, 被替换的节点)
返回被替换的节点 - cloneNode()
1、创建节点的拷贝,并返回该副本。
2、拷贝的节点要有父节点,如果没有父节点,要通过appendChild()、insertBefore()、replaceChild()等方法对其进行添加
(参数值有true,false,默认值是false,若为true则可深度复制,即复制子元素)
document.body.appendChild(newNode);
- normalize()
合并相邻的Text节点 - splitText()
1、按照指定的位置把文本分割成两个节点
2、返回分割后半部分的的文本节点
参数值为数字,指明分割点所在
**
删除节点
**
- removeChild();
删除元素中的节点,返回删除的节点,参数值为删除的节点 - removeNode();
1、IE的私有实现
2、将目标节点从文档中删除,返回目标节点
3、参数是布尔值Boolean,默认值是false,true会删除子元素 - innerHTML();
var myUl = documnet.getElementById('myUl');
myUl.parentNode.removeChild(myUl);
console.log(myUl.id + ":" + myUl.innerHTML); //可以显示li的内容(断树枝)
var myUl2 = documnet.getElementById('myUl2');
myUl2.parentNode.innerHTNL = '';
console.log(myUl2.id + ":" + myUl2.innerHTML); //在IE6-8上无法显示,为空(断树枝,烧掉)
- deleteContent();
- textContent();
- **