2019-09-06
2019-10-11 本文已影响0人
Amuer蘃
节点的关系
var box = document.getElementsByClassName('box')[0];
var wrap = document.getElementsByClassName('wrapper')[0];
var span = document.getElementById('span');
var head =document.getElementsByTagName('head')[0];
// console.log(head.parentNode)
// 都识别空格
// console.log(box.childNodes)//返回所有子元素
// console.log(box.firstChild) //获取父元素里的第一个子元素 ,返回子元素及里面的内容,不能有空格,有空格返回#text
// console.log(box.lastChild.firstChild) //获取父元素里的最后一个子元素 ,返回子元素及里面的内容,不能有空格,有空格返回#text
console.log(wrap.firstChild) // 如果该节点没有子节点返回null
console.log(wrap.lastChild)
console.log(span.parentNode)//获取父节点
console.log(wrap.childNodes)//获取所有子节点,找不到返回一个空数组
// 不识别空格
console.log(head.childElementCount)//返回子元素的个数(不包括节点和注释)
console.log(box.firstElementChild) //
console.log(box.lastElementChild.lastElementChild)
console.log(wrap.firstElementChild) // 如果该节点没有子节点返回null
console.log(wrap.lastElementChild)
console.log(span.parentNode)//获取父节点
console.log(wrap.childNodes)//获取所有子节点,找不到返回一个空数组
console.log(wrap.previousElementSibling)//获取前一个同辈元素
console.log(wrap.nextElementSibling)//获取后一个同辈元素
console.log(box.children)//返回所有子元素,返回一个数组,不识别空格
var p = document.createElement('p');
p.classList.add ('aa')//通过classList方法为元素添加类名,添加多个用逗号隔开
// p.classList.remove ('aa')//通过classList方法为元素删除类名
console.log( p.classList.contains ('aa'))//通过classList方法检测该元素是否有这个类名,返回布尔值