Web API 是浏览器提供的一套操作浏览器功能和页面元素的 API 。（W3C 组织的标准）
API（Application Programming Interface,应用程序编程接口）是一些预先定义的函数，目的是提供应用程序 与开发人员基于某软件或硬件得以访问一组例程的能力，而又无需访问源码，或理解内部工作机制的细节。 简单理解： API 是给程序员提供的一种工具，以便能更轻松的实现想要完成的功能。
API 和 Web API 总结1. API 是为我们程序员提供的一个接口，帮助我们实现某种功能，我们会使用就可以了，不必纠结内部如何实现 2. Web API 主要是针对于浏览器提供的接口，主要针对于浏览器做交互效果。 3. Web API 一般都有输入和输出（函数的传参和返回值），Web API 很多都是方法（函数） 4. 学习 Web API 可以结合前面学习内置对象方法的思路学习
JS 基础学习 ECMAScript 基础语法为后面作铺垫， Web APIs 是 JS 的应用，大量使用 JS 基础语法做交互效果 。
1.什么是 DOM
文档对象模型（Document Object Model，简称 DOM），是 W3C 组织推荐的处理可扩展标记语言（HTML 或者XML）的标准编程接口。 W3C 已经定义了一系列的 DOM 接口，通过这些 DOM 接口可以改变网页的内容、结构和样式。
2.获取元素
DOM在我们实际开发中主要用来操作元素。 我们如何来获取页面中的元素呢? 2.1 如何获取页面元素 ，获取页面中的元素可以使用以下几种方式: 根据 ID 获取 根据标签名获取 通过 HTML5 新增的方法获取 特殊元素获取
2.2 根据 ID 获取
使用 getElementById() 方法可以获取带有 ID 的元素对象。
document.getElementById('id');使用 console.dir() 可以打印我们获取的元素对象，更好的查看对象里面的属性和方法。
2.3 根据标签名获取
使用 getElementsByTagName() 方法可以返回带有指定标签名的对象的集合。
document.getElementsByTagName('标签名');注意： 1. 因为得到的是一个对象的集合，所以我们想要操作里面的元素就需要遍历。 2. 得到元素对象是动态的 3. 如果获取不到元素,则返回为空的伪数组(因为获取不到对象)
还可以获取某个元素(父元素)内部所有指定标签名的子元素.
element.getElementsByTagName('标签名');注意：父元素必须是单个对象(必须指明是哪一个元素对象). 获取的时候不包括父元素自己。
2.4 通过 HTML5 新增的方法获取
1. document.getElementsByClassName(‘类名’)；// 根据类名返回元素对象集合
2. document.querySelector('选择器'); // 根据指定选择器返回第一个元素对象 3. document.querySelectorAll('选择器'); // 根据指定选择器返回
注意： querySelector 和 querySelectorAll里面的选择器需要加符号,比如:document.querySelector('#nav');
2.5 获取特殊元素（body，html）
获取body元素
doucumnet.body // 返回body元素对象获取html元素
document.documentElement // 返回html元素对象3. 事件基础
3.1 事件概述
JavaScript 使我们有能力创建动态页面，而事件是可以被 JavaScript 侦测到的行为。 简单理解： 触发--- 响应机制。 网页中的每个元素都可以产生某些可以触发 JavaScript 的事件，例如，我们可以在用户点击某按钮时产生一个 事件，然后去执行某些操作。
3.2 事件三要素
1. 事件源 （谁） 2. 事件类型 （什么事件） 3. 事件处理程序 （做啥）
案例：点击按钮弹出警示框 页面中有一个按钮，当鼠标点击按钮的时候，弹出“你好”警示框。
案例分析 ① 获取事件源（按钮） ② 注册事件（绑定事件），使用 onclick ③ 编写事件处理程序，写一个函数弹出 alert 警示框
实现代码
var btn = document.getElementById('btn'); btn.onclick = function() { alert('你好吗'); };3.3 执行事件的步骤
1. 获取事件源 2. 注册事件（绑定事件） 3. 添加事件处理程序（采取函数赋值形式）
