DOM&操作元素

1、DOM：Document Object Model：文档对象模型，专门用于操作HTML文档的，提供了很多的方法

2、DOM树：树根document对象，可以通过它找到我们需要的元素

3、查找元素： 1、HTML特点 ID：其实不用找，直接可用

	标签名和class名：var elems=document/爸爸.getElementsByTag/ClassName("标签名/class名");
		没找到是一个空集合，而且集合不能直接用于做操作，要么下标拿到某个元素，要么遍历拿到每个元素
		不一定非要从document开始，可以写为一个自己已经找到的父元素

2、关系：前提：至少要先找到一个人，才可使用关系
	父：elem.parentNode;
	子：elem.children;
	第一个儿子：elem.firstElementChild;
	最后一个儿子：elem.lastElementChild;
	前一个兄弟：elem.previousElementSibling;
	后一个兄弟：elem.nextElementSibling;

2、操作元素： 内容：innerHTML(双标签，识别标签)/innerText(双标签，纯文本)/value（input专属） 获取：elem.以上三个中的一个 设置：elem.以上三个中的一个="新值"

属性：
	获取：elem.getAttribute("属性名");		===>	elem.属性名
	设置：elem.setAttribute("属性名","属性值")	===>	elem.属性名="新值"
	特殊：简化版：
		1、class必须写为className
		2、自定义属性不能使用简化版

样式：操作内联
	获取：elem.style.css属性名 - 只能获取到内联样式
	设置：elem.style.css属性名="css属性值";

绑定事件：我们要让HTML（内容）和CSS（样式）和JS（行为）分离
	elem.on事件名=function(){//回调函数，是不需要程序员去调用的，在你点击的时候，会自动调用
		操作;
		关键字：this->目前只能在事件之中使用
		单个元素绑定事件，this->就是这个元素
		多个元素绑定事件，this->当前触发事件的元素
	}