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方法检测该元素是否有这个类名,返回布尔值
上一篇下一篇

猜你喜欢

热点阅读