1.DOM与BOM.

ECMAScript（核心）：JavaScript 语言基础；
DOM(Document Object Model)文档对象类型：规定了访问HTML和XML的接口；
BOM（Browser Object Mode）浏览器对象模型：提供了独立于内容而在浏览器窗口之间进行交互的对象和方法。

ECMAScript

不属于任何浏览器;
定义了 JavaScript 脚本中最为核心的内容;
是 JavaScript 脚本的“骨架”;
最新版本是 ES7;

BOM

定义了 JavaScript 操作浏览器的接口;
提供了访问某些功能（如浏览器窗口大小、版本信息、浏览历史记录等）的途径以及操作方法;

DOM

DOM 定义了 JavaScript 操作 HTML 文档的接口;
提供了访问HTML文档的途径以及操作方法;
DOM操作html树，包括节点和节点之间的关系；
对节点：增删改查；
对关系：父子，非父子；
child,parent,siblings;
获取节点方法：

1
2
3

document.getElementById("");
document.getElementsByClassName("");
document.getElementsByTagName("");

CSS选择器复习

优先级排列：内联样式，id，class，tag；

#2.JavaScript的事件机制.

事件冒泡—IE事件流

开始由最具体的元素接收，然后逐渐传播到不那么具体的节点;
div→body→html→document；

事件捕获—Netscape

完全相反.

DOM标准事件模型

1.事件捕获阶段;
2.处于目标阶段;
3.事件冒泡阶段;
*需要注意的是，1阶段不到body，body被看作是3阶段一部分;

处理事件的两种方法

1 2	addEventlistener(event,fn,boolean); removeEventListener(event,fn,boolean);

IE事件处理：

1 2	attachEvent(event,fn); detachEvent(event,fn);

*跨浏览器的事件处理：以后再议;

2.IFE Task

2-1

button[0].addEventListener('click',function(){
    display.innerHTML = input.value;
})
#.value 加在值变化之后，不能作用于空值.

oninput: 作用于input标签或textarea标签，实时调用js函数;
格式：

1	<input oninput= "myFunction()"></input>

2-2

新操作.

newData.sort(function (a, b) {
        return b[1] - a[1];
    });
    # sort
    # 基本形式是
    # object.sort(function(a,b){
    #     return a-b;
    # })
    # 其中a-b：从小到大排序；b-a：从大到小；

var number = ["一","二","三","四"];
    for (var i = 0; i < newData.length; i++) {
        var li = document.createElement("li");
        var ul = document.getElementById("aqi-list");
        ul.appendChild(li);
        li.innerHTML = "第" + number[i] + "名" + ":" + newData[i][0] + "," + newData[i][1];
        console.log(newData[i]);
        #<li>第一名：福州（样例），10</li>
        #<li>第二名：福州（样例），10</li>
    }

以上.