预备知识：childNodes:返回一个元素的子节点
document： 一个最顶层的虚拟节点：他有两个子节点： <!DOCTYPE html>
<html lang="en">
<!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{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>
以上可以看出 document html body 的范围
Document 对象
每个载入浏览器的 HTML 文档都会成为 Document 对象。
Document 对象使我们可以从脚本中对 HTML 页面中的所有元素进行访问。
Document 对象是 Window 对象的一部分，可通过 window.document 属性对其进行访问
get...方法其他元素也可以用，继承？