DOM基础
- childNodes
返回指定元素的子元素集合，在IE6-8下，只返回元素节点，在IE9和chrome下会连同文本节点一起返回，所以需要通过if判断obj[i] == 1，来筛选元素节点。 - children
返回指定元素子元素的集合，只包括元素节点，且是一级子元素 - nodeType
返回节点类型 - parentNode
返回父节点，可以做点击隐藏父节点 - offsetParent
返回一个指向最近的包含该元素的定位元素，比如一个元素position为absolute，使用element.offsetParent可以知道该元素相对谁定位 - firstChild和firstElementChild
用于选取改元素的第一个子元素，前者支持ie6-8，后者支持高级浏览器，相似的还有lastChild和lastElementChild、nextSibling和nextElementSibling（下一个兄弟元素）、previousSibling和previousElementSibling - getAttribute(属性名称)
获取元素的属性 - setAttribute（属性名称，属性值）
设置属性值 - 通过className选择元素
var aLi = document.getElementsByTagName("li");
for (var i = 0; i < aLi.length; i++) {
if (aLi[i].className == "tored") {
aLi[i].style.backgroundColor = "red";
}
}
封装一个getByClass函数
function getByClass(parent, class) {
var result = [];
var aEle = parent.getElementsByTagName("*");
for (var i = 0; i < aEle.length; i++) {
if (aEle[i].className == class) {
result.push(aEle[i]);
}
}
return result;
}
- createElement() 创建一个节点
var =createLi = document.createElement("li");
- appendChild() 向当前节点的子节点末尾添加新的子节点
node.appendChild(createLi)
- insertBefore() 在当前节点某个子节点之前再插入一个子节点
node.insertBefore(createLi, 某个子节点)
- removeChild() 删除当前节点的某个子节点
node.removeChild(某个子节点)
