节点：页面中的所有内容（标签，属性，文本（文字，换行，空格，回车）），Node
节点的相关属性：（可以使用标签--元素.出来，可以是哟经属性节点.出来，文本节点.出来）
nodeType：节点类型：1---标签；2---属性；3---文本
nodeName:节点名字：标签节点---大写的标签名字；属性节点---小写的属性名字；文本节点----#text
nodeValue：节点的值：标签节点--null；属性节点--属性值；文本节点---文本内容
获取相关的父级节点和父级元素：
parentNode
<script>
var pobj=my$('pr');
//获得父级节点
console.log(pobj.parentNode);
//获得父级元素
console.log(pobj.parentElement);
</script>
获取子节点子元素：
<script>
var dvobj=document.getElementById('dv');
//子节点,节点数要注意计算空格部分
console.log(dvobj.childNodes);
//子元素
console.log(dvobj.children);
</script>
图片发布于简书APP
图片发布于简书app
图片发布于简书APP
总结：
凡是获取节点的代码在谷歌和火狐得到的都是相关的节点
凡是获取元素的代码在谷歌和火狐得到的 都是相关的元素
从子节点和兄弟节点开始，凡是获取节点的代码在IE8中得到的是元素，获取元素的相关代码，在IE8中得到的是undefined---元素的代码，在IE中不支持
案例：通过节点操作元素的换行变色
图片发布于简书APP
兼容和封装
图片发布于简书APP
图片发布于简书APP
全选，全不选
图片发布于简书APP
元素创建的不同方式
元素创建------为了提高用户的体验
元素创建的三种方式：
1.document.write（“标签的代码及内容”）
2.对象.innerHTML="标签及代码‘
3.document.creatElement("标签的名字")’
1.document.write（）
图片发布于简书APP
2..对象.innerHTML="标签及代码‘
案例：点击按钮，在div中创建一个p标签
图片发布于简书APP
动态创建列表：
通过innerHTML动态添加图片
图片发布于简书APP
动态加入列表
图片发布于简书APP
动态创建列表，鼠标进入背景颜色发生变化
图片发布于简书APP
扩展document.write（）可以嵌入外部的代码内容
图片发布于简书APP
3.document.creatElement("标签的名字")’
案例：动态添加表格
图片发布于简书APP
图片发布于简书APP
只创建一个元素
图片发布于简书APP
为元素绑定事件
图片发布于简书APP
//addEventListener：谷歌火狐支持，IE8不支持
//attachEvent：谷歌火狐支持，IE8不支持
兼容问题：
为任意元素，绑定任意的事件
图片发布于简书APP
网友评论