1.API和webAPI 1.1API概念
API（Application Programming Interface）应用程序编程接口，简单理解API是给程序员提供的一种工具，以便能更轻松的完成想要的功能。
1.2webAPI概念webAPI是浏览器提供的一套操作浏览器功能和页面元素的接口（BOM、DOM）。比如我们想要浏览器弹出一个警示框alert('警示框')，alert就是浏览器的API
2.总结API是为程序员提供的接口，帮助实现某种功能，会使用就可以了，不用纠结内部如何实现。
webAPI主要针对的是浏览器提供的接口，主要针对于浏览器做交互效果。
webAPI一般都有输入输出（函数的传参和返回值），webAPI很多都是方法（函数）。
二、DOM 1.DOM的概念DOM（Document Object Model）文档对象模型，是W3C组织推荐的处理可扩展标记语言（html或者xhtml）的标准编程接口。W3C 已经定义了一系列的 DOM 接口，通过DOM接口就可以改变网页的内容、结构、样式。
2.DOM树- 文档：一个页面就是一个文档，在DOM中用document表示。
- 元素：页面中所有的标签都叫元素，在DOM中用element表示。
- 标签节点：网页中的所有内容都是结点（标签、文本、属性、注释等），在DOM中用node表示。
- DOM把以上内容都看作式是对象
语法：
document.getElementById('元素id')
举例
注意：id值是唯一的，若页面上有相同的id值的标签时，在获取时，获取的是id值第⼀次出现的标签。
3.2根据标签名获取⼀组元素语法：
document.getElementsByTagName('标签名')
举例：
- 1
- 2
- 3
- 4
- 5
- 11
- 22
- 33
- 33
- 55
语法：
document.getElementsByName('名字')
举例：
啦啦啦
1234
1234
1234455
getElementsByName()方法都是用于获取表单元素。（不常用）
3.5*querySelector和querySelectorAll语法：
//根据选择器获取单个元素
document.querySelector('css选择器')
//根据选择器获取⼀组元素
document.querySelectorAll('css选择器')
注意：querySelector返回指定选择器的第一个元素对象。
querySelector和querySelectorAll 里面的选择器需要加选择器符号,参数是css选择器(包含复合选择器)。
举例：
啦啦啦
第一个
1234
第二个
3.6获取特殊元素
//获取body元素 document.body //获取html元素 document.documentElement4.事件基础
用户做的动作就是事件。
用户和网页之间的交互行为（鼠标点击、鼠标进⼊、鼠标离开、键盘按下、键盘弹起、手指按压、手指移动等等）。
4.1事件三要素及及执行事件的步骤事件三要素分为：
- 事件源：被触发的元素，如点击的按钮。
- 事件类型：如何触发的事件，比如点击按钮（onclick）、鼠标移入移出等。
- 事件处理程序：事件发生后的结果。
执行事件的步骤：
- 获取事件源（获取结点）
- 绑定事件
- 事件处理程序（采用函数赋值的形式）
onmouseenter鼠标进入，onmouseleave鼠标离开
例：多节点添加点击事件
4.3取消标签a的默认跳转行为
法一：return false
法二：设置a标签的href属性值为：javascript:
4.4操作元素的属性
法一：
- 获取：元素.属性名
- 设置（添加、修改）：元素.属性名=值
注意：在处理类名的时候不写class，要写className。
法二：
- 获取元素：getAttribute('属性','属性值'）
- 设置属性以及属性值：setAttribute('属性','属性值'）
- 删除属性：removeAttribute('属性')
总结：
一、通过.添加获取属性
1.如果是语言规定好的属性,.添加,就会出现在行内,否则不会出现在行内
2.获取属性,如果是行内属性,可以直接获取,但是,行内属性如果是自定义的,就无法获取（undefind）
3.通过.最好操作内置属性(语言规定好的属性)
4.通过.添加自定义属性,可以通过.获取回来,但是不会出现在行内
二、通过 Attribute 添加获取属性
1.既可以添加内置属性,也可以添加自定义属性,都会出现在行内
2.获取:既可以获取内置属性,也可以获取自定义属性
3.无法获取通过.添加的自定义属性
*4.Attribute只能操作出现在行内的属性
4.5样式操作属性可以通过JS来修改元素的大小、颜色、位置等样式。
4.5.1通过element.style更改元素样式
兔兔兔兔
注意：利用element.style修改元素样式，只适用于修改的样式比较少或者比较简单的情况下使用，不然太麻烦了。
4.5.2通过className更改元素样式
语法规范：
在处理类名的时候不写class，要写className。
修改元素样式：
注意：通过className修改元素样式，适用于样式较多或者功能较复杂的情况。
className会直接更改元素类名，会覆盖原先的类名（利用多类名选择器解决）。
4.6innerText和innerHTML的区别
文字
1111
暑期编程PK赛
得CSDN机械键盘等精美礼品！
