DOM:
Document Object Model (文档对象模型）。文档指得就是整个网页，对象指得是将网页中的每一个部分都转成对象，模型值得是网页的结构，能体现节点与节点的关系，方便获得对象。
Node(节点）是构成我们网页的最基本的组成部分，网页的每一个部分都可以称为节点。
常用的节点:1:文档节点：整个html文档。
2：元素节点：html文档中的html标签。
3：属性节点：元素的属性。
4：文本节点：html标签中的文本内容。
浏览器已经为我们提供了文档节点对象，对象是window属性，可以在页面内直接使用。
事件：就是用户与浏览器的交互行为。
处理事件：我们可以在事件对应的属性中加一些js代码，当事件触发时，js代码就会被执行。还有一种方式是为对应事件绑定处理函数的形式来响应事件，这样当事件触发时，其对应的函数将会被调用，先获取对象，在为其绑定一个单击事件，比如btn.onclick=function(){}
浏览器在加载一个页面时，是按照自上而下的顺序加载的，读取到一行就运行一行，如果script标签放在上面，页面还没有加载就执行了。onload 这个事件会在整个页面加载完成后才触发。
获取元素：通过document对象来调用。
1：document.getElementById() get 的意思是获得，Element的意思是元素，By的意思是通过，Id的意思是名字。要想修改文本内容，可以元素.innerHTML=" "。通过id属性获取一个元素节点对象。
2：document.getElementsByTagName()通过标签名获取一组元素节点对象。TagName的意思是标签名。这个方法会给我们返回一个类数组对象，所有查询到的元素都会封装到数组中。对于自结束标签，innerHTML属性没有意义。如果需要读取元素节点属性名，直接使用元素.属性名。class不能使用这种方式，读取class属性时需要使用元素.className
3：document.getElementsByName()通过name属性获取一组元素节点对象。
获取元素节点的子节点：通过具体的元素节点调用。
1：getElementsByTagName()方法：返回当前节点的指定标签名后代节点。
2：childNodes属性：表示当前节点的所有子节点。
3：firstChild属性：表示当前节点的第一个子节点。
4：lastChild属性：表示当前节点的最后一个子节点。
5:children属性：可以获取当前元素的所有子元素。
获取父节点与兄弟节点：通过具体的节点调用
1：属性parentNode表示当前节点的父节点。innerText可以获取元素内部的文本内容，与innerHTML不同的是他会将html标签去除。
2：属性previousSibling表示当前节点的前一个兄弟节点
3：属性nextSibling表示当前节点的后一个兄弟节点。
要想获取body直接document.body。documnet.documentElement是html。document.all是所有的元素。
根据元素的class属性值查询一组元素节点对象.document.getElementsByClassame() 可以获取一组元素节点对象。
document.querySelector(),需要一个选择器的字符串作为参数，可以根据一个class选择器来查询一个元素节点对象。使用该方法总会返回唯一的一个元素，如果满足条件的元素有多个，但只会返回第一个。document.querySelectorAll()它会将符合条件的元素封装到一个数组中返回。
DOM增删改：
document.createElement(),创建元素节点。它可以创建一个元素节点对象，需要一个标签名作为参数，将会根据该标签名创建元素对象，并将创建好的对象作为返回值返回。
document.createTextNode(),可以创建一个文本节点对象，需要一个文本内容作为参数，将会根据该内容创建文本节点，并将新的节点返回。
appendChild(),像父节点中添加一个新的子节点。用法：父元素.appendChild(字节点)
insertBefore(),在指定的子节点前插入新的子节点。语法：父节点.insertBefore(新节点，旧节点)
replaceChild(),使用指定的子节点替换旧的子节点，语法：父节点.replaceChild(新节点，旧节点)
removeChild()，可以删除一个子节点。语法：父节点.removeChild(子节点)
使用innerHTML也可以完成DOM增删改的相关操作。
confirm()用于弹出带有一个确认和消失的提示框，需要一个字符串作为参数，该字符串将会作为提示文字显示出来。如果用户点击确认，则返回true，如果用户点击消失，则返回false.
使用DOM操作css:
语法：元素.stye.样式名=样式值。如果css的样式中含有-，在js中这是不被允许的，需要将这种样式名改为驼峰命名法，去掉-号。我们通过style设置的属性都是内联样式。
读取：语法：元素.style.样式 通过style读取的内连样式。 获取元素当前显示的样式;语法：元素.current(当前的)Style.样式名，它可以读取当前元素正在显示的样式名，如果当前元素没有设置该样式，则获取默认值。
读取：getComputedStyle()这个方法来获取当前的样式，这个方法是window的方法，可以直接使用。需要2个参数：第一是样式的元素，第二个可以传递一个伪元素，一般都是null.该方法会返回一个对象，对象中封装了当前元素的样式 。可以通过对象.样式名来读取样式。如果获取的样式没有设置，则会获取真实的值，不会获取默认值。
读取：定义一个函数来获取指定元素的当前样式，参数:obj 要获取的样式的元素 name要获取的样式。
通过getComputedStyle()和currentStyle()读到的样式都是只读的，不能修改，修改只能通过style属性。
clientWidth和clientHeight可以获取元素的可见宽度和高度，返回的值可以直接计算，包括内容区和边距，这些属性只能读不能改。
offsetWidth和offsetHeight可以获取元素的整个宽度和高度，包括内容区，内边距和边框。
offsetParent可以定位当前元素的父元素，会获取当前元素最近的开启了定位的祖先元素，如果所有的祖先元素都没有开启定位，则返回body.
offsetLeft与offfsetRight可以获取当前元素相当于其定位父元素的水平偏移量。