定时器
1.定时器:设定时间，在指定的时间之后执行函数或者是程序
a.反复性定时器：var dingshiqi=Window.setInterval(“函数名()”,时间n[毫秒值]);在每隔定的时间n就会执行一次函数，反复执行
b.一次性定时器：var dingshiqi=window.setTimeout(“函数名()”,时间n[毫秒值]);在指定的时间n毫秒之后执行一次函数，执行以后不在执行
2.清除定时器:让定时器不再执行
a.清除反复性定时器：Window.clearInterval(dingshiqi);
b.清除一次性定时器：window.clearTimeout(dingshiqi);
案例：
星星案例
星星案例修改
案例分享
图片的切换：轮播图经典案例。
DOM树
Document Object Model：文档对象模型
- D：documnet，文档，html文档或者xml文档
- O：object，对象，在转成树模型的时候，得到的对象，它有相应的属性和方法，利用他们可以完成任何操作。
- M：model，模型，树模型，有节点构成的一颗树。节点（元素、属性和文本）转成对象。
DOM的分类 - 核心DOM：提供了操作HTML文档(显示)或XML文档(存储数据)的公共的属性和方法。
- HTMLDOM：针对HTML文档，提供的专有的属性和方法。
- XMLDOM：针对XML文档，提供的专有的属性和方法。
- EventDOM：事件DOM，提供了很多的常用事件。
- CSSDOM：提供了操作CSS的一个接口。
HTML节点树：
DOM中节点的类型：
- document文档节点：代表整个网页，document文档节点不对应标记。是访问文档中各元素的起点。
- element元素节点：元素节点对应于网页中的各标记。
- attribute属性节点：每个元素都有若干个属性。
- text文本节点：文本节点是最底层节点。
核心DOM公共属性和方法 - nodeName：节点名称。
- nodeValue：节点的值。
- firstChild：第一个子节点。
- lastChild：最后一个子节点。
- parentNode：父节点。
- childNodes：子节点列表，是一个数组。
查找html节点的方法 - document.firstChild
- document.documentElement(兼容性较好)
查找body节点的方法 - document.firstChild.lastChild
- document.body(推荐使用)
在核心DOM中，已经可以实现对网页元素的操作了，为什么还要有HTMLDOM呢？
因为，核心DOM中，对节点的访问，都是从根节点开始的，访问方式十分麻烦。特别是当节点层次很深时，更是麻烦。因此，才有了HTMLDOM。
1、HTMLDOM的新特性
- 每一个HTML标记，都对应一个对象。如：
标记，就是一个img对象。
- 每一个HTML标记的属性，与对应的元素对象的属性，一一对应。
- img属性：src、width、height、border、style、title、id、class等。
- 在JS中，img对象属性：src、width、height、border、style、title、id、className等。
HTML DOM访问HTML元素的方法
1、根据元素的id查找对象——document.getElementById(id)
2、根据HTML标签名找对象
- 描述：根据HTML标签名找对象
- 语法：var arr = parentNode.getElementsByTagName(tagName)
- 参数：tagName就是要查找的标签名称，不能带尖括号。parentNode代表上层节点。
- 返回值：返回一个对象数组。
- 举例：ulObj.getElementsByTagName(“li”)
元素对象
offsetWidth：指元素的可见宽度，不含滚动条中的内容。只读属性。不带px单位。
offsetHeight：指元素的可见高度，不含滚动条中的内容。只读属性。不带px单位。
scrollWidth：指元素的总宽度，包含滚动条中的内容。只读属性。不带px单位。
scrollHeight：指元素的总高度，包含滚动条中的内容。只读属性。不带px单位。
scrollTop：当元素出现滚动条时，向下拖动滚动条，内容向上滚动的距离。可读可写属性。不带px单位。如果该元素没有滚动条，则scrollTop的值为0，该值只能是正值。
scrollLeft：与scrollTop描述一样，只是向左滚动的距离。
书序案例
书讯快递