JS入门基础（三）

2019.09.24

JavaScript的组成

ECMAScript - JavaScript的核心 es5 es6

定义了JavaScript 的语法规范
JavaScript的核心，描述了语言的基本语法和数据类型，ECMAScript是一套标准，定义了一种语言的标准与具体实现无关

BOM - 浏览器对象模型 brower Object Model

一套操作浏览器功能的API
通过BOM可以操作浏览器窗口，比如：弹出框、控制浏览器跳转、获取分辨率等

DOM - 文档对象模型

一套操作页面元素的API
DOM可以把HTML看做是文档树，通过DOM提供的API可以对树上的节点进行操作

DOM

DOM又称为文档树模型

• 文档：一个网页可以称为文档
• 节点：网页中的所有内容都是节点（标签、属性、文本、注释等）
• 元素：网页中的标签
• 属性：标签的属性

DOM经常进行的操作

• 获取元素
• 对元素进行操作(设置其属性或调用其方法)
• 动态创建元素
• 事件(什么时机做相应的操作)

获取页面元素

根据id获取元素

例：

var div = document.getElementById("id2");

当id重名的时候，会获取第一个，id有唯一性的

根据标签名获取元素

例：

//标签名获取元素
		var div = document.getElementsByTagName("div")[5];
		alert(div);

根据name获取元素*

例：

// 通过name来获取
		var names = document.getElementsByName('n');
		for (var i = 0; i < names.length; i++) {
			alert(names[i]);
		}
		alert(names);

根据类名获取元素*

例：

// 通过类名
		var mains = document.getElementsByClassName("main");
		alert(mains);

根据选择器获取元素*

例：

// 根据选择器获取元素
		var id1 = document.querySelector('#id1');
		alert(id1);
		var mains = document.querySelectorAll('.main');
		alert(mains);

事件

事件：触发-响应机制

事件三要素

• 事件源:触发(被)事件的元素
• 事件名称: click 点击事件
• 事件处理程序(回调函数):事件触发后要执行的代码(函数形式)