JS（13）事件基础

1.事件三要素

-- 事件源（谁）：触发事件的元素
-- 事件类型（什么事件）：click
-- 事件处理程序（做啥）：事件触发后要执行的代码（函数形式），事件处理函数

2.事件执行的步骤

1.获取事件源
2.注册事件
3.添加事件处理程序（采取函数赋值形式）

3.常见的鼠标事件

鼠标事件	触发事件
onclick	点击左键触发
onmouseover	鼠标经过触发
onmouseout	鼠标离开触发
onfocus	获得鼠标焦点触发
onblur	失去鼠标焦点触发
onmousemove	鼠标移动触发
onmouseup	鼠标弹起触发
onmousedown	鼠标按下触发

4.操作元素

4.1.改变元素内容（获取或设置）

1.element.innerText
	从起始位置到终止位置的内容，但它去除空格和换行，不识别html标签，非标准的
2.element.innerHTML
	起始位置到终止位置的全部内容，包括html标签，同时保留空格和换行，识别html标签，W3C标准
	这两个属性是可读写的，可以获取元素里面的内容

4.2.常见元素的属性操作

1.innerText，innerHTML改变元素内容
2.src、href
3.id、alt、title
4.获取属性的值，
	元素对象.属性名
5.设置属性的值
	元素对象.属性名=值

4.3.表单元素的属性操作

-- 利用DOM可以操作如下表单元素的属性
	type，value，checked，selected，disabled
-- 获取属性的值
	元素对象.属性名
-- 设置属性的值
	元素对象.属性名=值
-- 表单元素中有一些属性如：disabled、checked、selected，元素对象的这些属性的值是布尔型

4.4.样式属性操作

1.element.style 		行内样式操作
2.element.className		类名样式操作
方式1:通过操作style属性
	元素对象的style属性也是一个对象
	元素对象.style样式属性 = 值
注意：1.JS里面的样式采取驼峰命名法，比如fontSize，backgroundColor
	 2.JS里修改style样式操作，产生的是行内样式，css权重比较高
方式2:通过操作className属性
	元素对象.className = 值
注意：1.如果样式修改较多，可以采取操作类名方式更改元素样式
	 2.class因为是保留字，因此使用ClassName来操作元素类名属性
	 3.className会直接更改元素的类名，会覆盖原先的类名。