JavaScript-DOM操作

webapi介绍

api的概念：API（Application Programming Interface,应用程序编程接口）是一些预先定义的函数，目的是提供应用程序与开发人员基于某软件或硬件得以访问一组例程的能力，而又无需访问源码，或理解内部工作机制的细节。例如：alert()、 prompt()、log()、reverse()、getMonths()。

webapi的概念：

浏览器提供的一套操作浏览器功能和页面元素的API(BOM和DOM)

我们可以通过API去操作DOM和BOM

此处的web API特指浏览器提供的API(一组方法)，web API在后面的课程中有其它含义

 JavaScript的组成分为：ECMAScript、DOM、BOM

DOM概念：事件基础文档对象模型（Document Object Model，简称DOM），是W3C组织推荐的处理可扩展标志语言的标准编程接口。在网页上，组织页面（或文档）的对象被组织在一个树形结构中，用来表示文档中对象的标准模型就称为DOM。Document Object Model的历史可以追溯至1990年代后期微软与Netscape的“浏览器大战”，双方为了在JavaScript与JScript一决生死，于是大规模的赋予浏览器强大的功能。微软在网页技术上加入了不少专属事物，既有VBScript、ActiveX、以及微软自家的DHTML格式等，使不少网页使用非微软平台及浏览器无法正常显示。DOM即是当时蕴酿出来的杰作。DOM又称为文档树模型。

获取元素的方式：

根据id获取元素（var div1 = document.getElementById("");）

通过类名获取元素（var p1Arr = document.getElementsByClassName("")）

伪数组定义：可以通过for循环遍历，数组中专有元素不能使用

通过标签名获取元素（document.getElementsByTagName("");）

通过name名获取元素（document.getElementsByName("");）

通过选择器的querySelector获取元素（var div1 = document.querySelector(".box1");）

通过选择器的querySelectorAll获取元素（querySelectorAll():获取指定选择器的所有的元素，参数就是选择器的名称document.querySelectorAll(".box1");）

事件初识

事件：触发-响应机制

事件三要素：（事件源:触发(被)事件的元素

事件类型:事件的触发方式(例如鼠标点击或键盘点击)

事件处理程序:事件触发后要执行的代码(函数形式)）

鼠标单击事件：onclick    浏览器加载完成事件：onload