document

最新推荐文章于 2024-01-23 09:40:06 发布

weixin_30433075

最新推荐文章于 2024-01-23 09:40:06 发布

阅读量72

点赞数

CC 4.0 BY-SA版权

原文链接：http://www.cnblogs.com/everwangJS/p/4492218.html

预备知识：childNodes:返回一个元素的子节点

document：一个最顶层的虚拟节点：他有两个子节点： <!DOCTYPE html>

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Document</title>
    <style>
    html{border: 1px solid red;}
    body{border: 1px solid #000;}
    .div1{width:100px;height:100px;background:green;}
    </style>
</head>
<body>
这是body
<div class="div1">
    
</div>
    <script>
    window.onload=function(){
        console.log("document.childNodes[0]"+":"+document.childNodes[0]);
        console.log("document.childNodes[0].tagName"+":"+document.childNodes[0].tagName);
        console.log("document.childNodes[1].tagName"+":"+document.childNodes[1].tagName);
           
        document.body.onclick=function(){
            console.log("点击body");
        }
         /*document.html.onclick=function(){ //没有document.html
            console.log(点击html);
         }*/
        document.onclick=function(){
            console.log("点击document");
        }
 }
    </script>
</body>
</html>