美文网首页
2019-09-06

2019-09-06

作者: Amuer蘃 | 来源:发表于2019-10-11 11:33 被阅读0次

    节点的关系

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

    相关文章

      网友评论

          本文标题:2019-09-06

          本文链接:https://www.haomeiwen.com/subject/ciqpyctx.html