一、JavaScript作用:
帮助浏览器对用户提出请求进行处理。
二、DOM对象:
1.DOM 英文全称： Document Object Model， 中文全称：【文档模型对象】
2.JavaScript不能直接操作HTML标签，只能通过HTML标签关联的DOM对象对HTML标签下达指令。
三、DOM对象生命周期：
1.浏览器在接收到html文件之后，将HTML文件标签加载到浏览器缓存中，
每当加载一个html标签时候，自动为这个标签生成一个实例对象，这个实例对象就是DOM对象。
2.在浏览器关闭之前或则浏览器请求其他资源文件之前，本次生成的DOM对象一直存活在浏览器缓存中。
3.在浏览器关闭时候，浏览器缓存中DOM对象会被销毁。
4.在浏览器请求到新资源文件后，浏览器缓存中原有的dom对象将会被覆盖。
四、document对象：
1.document对象被称为【文档对象】
2.document对象用于在浏览器内存中根据定位条件定位DOM对象。
五、document对象生命周期:
1.在浏览器将网页中所有标签加载完毕后，在内存中将使用【树形结构】
存储这些DOM对象。在树形结构生成完毕后由浏览器生成一个document对象管理这颗树（DOM树）
在浏览器将接收的网页中标签加载完毕后，自动在浏览器内存生成一个document对象
2.一个浏览器运行期间，只会生成一个document对象 （也就是说：一个HTML文件就只有一个document，
一个浏览器分成三个网页[比如：在线考试管理系统]那就是分成了三个网页，就有三个document对象）
【一个BOM可以有一个或多个document，一个document对象中有多个DOM】
3.在浏览器关闭时，负责将document对象进行销毁
六、通过document对象定位DOM对象方式:
1.根据html标签的id属性值定位DOM对象
命令格式 var domObj = document.getElementById("id属性值")；
举个例子 var domObj = document.getElementById("one")；
通知document对象定位id属性等于one的标签关联的DOM对象
2.根据html标签的name属性值定位DOM对象
命令格式 var domArray = document.getElementsByName("name属性值");
举个例子 部门10
部门20
部门30
var domArray = document.getElementsByName("deptNo");
就是通知document对象将所有name属性等于deptNo的标签关联的DOM对象进行定位
并封装到一个数组进行返回。 domArray就是一个数组存放本次返回的所有DOM对象。
3.根据html标签类型定位DOM对象
命令格式 var domArray = document.getElementsByTagName("标签类型名");
举个例子 var domArray = document.getElementsByTagName("p");
段落标签
就是通知document对象将所有段落标签关联的dom对象进行定位并封装到一个数组返回
七、DOM对象对HTML标签属性操作
1.DOM对象 对标签value属性进行取值与赋值操作
取值操作:
var domObj = document.getElementById("one");
var num = domObj.value;
赋值操作:
var domObj = document.getElementById("one");
domObj.value = "abc";
2.DOM对象 对标签中【样式属性】进行取值与赋值操作
取值操作:
var domObj = document.getElementById("one");
//读取当前标签【背景颜色属性】值
var color = domObj.style.背景颜色属性
赋值操作:
var domObj = document.getElementById("one");
//通过DOM对象对标签中【背景颜色属性】进行赋值
domObj.style.背景颜色属性 = 值；
3.DOM对象 对标签中【状态属性】进行取值与赋值操作
状态属性：状态属性的值都是boolean类型
disabled = true ; 表示当前标签不可以使用
disabled = false; 表示当前标签可以使用
checked: 只存在与radio标签与checkbox标签
checked = true ; 表示当前标签被选中了
checked = false; 表示当前标签未被选中
取值操作:
var domObj = document.getElementById("one");
var num = domObj.checked;
赋值操作:
var domObj = document.getElementById("one");
domObj.checked = true;
4. DOM对象 对标签中【文字显示内容】进行赋值与取值
文字显示内容: 只存在于双目标签之间;100
取值操作:
var domObj = document.getElementById("one");
var num1 = domObj.innerText;
赋值操作:
var domObj = document.getElementById("one");
domObj.innerText = 值；
innerText与innerHTML 区别:
innerText与innerHTML都可以对标签文字显示内容属性进行赋值与取值
innerText只能接收字符串
innerHTML既可以接收字符串又可以接收html标签
八、JavaScript监听事件
1.监听事件:
监听用户在何时以何种方式对当前标签进行操作。当监听到相关行为时，
通知浏览器调用对应JavaScript函数对当前用户请求进行处理。
2.监听事件分类:
1)监听用户何时使用鼠标操作当前标签
* onclick : 监听用户何时使用鼠标【单击】当前标签
* onmouseover: 监听用户何时将鼠标【悬停】当前标签上方
* onmouseout : 监听用户何时将鼠标从当前标签上方【移开】
* onfocus : 监听用户何时通过鼠标让当前标签获得【光标】
* onblur : 监听用户何时通过鼠标让当前标签丢失【光标】
2)监听用户何时使用键盘操作当前标签
* onkeydown :键盘弹起
* onkeyup :键盘按下
