一.BOM
-
概念
BOM，全称是Browser Object Model 浏览器对象模型，主要是将浏览器的各个组成部分封装成对象。
-
组成
BOM主要有以下几种对象：
-
Window
窗口对象
-
Navigator
浏览器对象
-
Screen
显示屏幕对象
-
History
历史记录对象
-
Location
地址栏对象
-
-
BOM对象详解
BOM对象只了解常用的：Window对象，Location对象，History对象
-
Window 窗口对象
-
创建
Window对象不需要创建，直接可以用（它最大）
-
方法
与弹出框有关的方法：
-
alert()：显示带有一段消息和一个确认按钮的警告框。 -
confirm()：显示带有一段消息和确认按钮以及取消按钮的对话框点击确认按钮，则返回true；点取消按钮，则返回false -
prompt()：显示可提示用户输入的对话框，返回值是用户输入的值。
与打开关闭相关的方法：
-
close()：关闭浏览器窗口。谁调用这个close，就关闭谁 -
open()：打开一个新的浏览器窗口，返回一个新的Window对象
与定时器有关的方式：
-
setTimeout()：指定毫秒数，在毫秒数过后调用函数参数：
- js代码或者方法对象
- 毫秒值
返回值：定时器ID，用于取消定时器
-
clearTimeout()：用于取消setTimeout()设置的定时器 -
setInterval()：指定毫秒为周期，调用函数（周期性调用） -
clearInterval()：取消由setInterval()设置的定时器
-
-
属性
-
获取其他BOM对象
History，Location，Navigator，Screen都是通过window获取的。
-
获取DOM对象：document
-
-
特点
window对象不需要创建可以直接使用，使用方式：window.方法名()
window引用可以省略，直接调用，方法名()
-
-
Location：地址栏对象
-
获取
window.location(可直接使用location)
-
方法
-
reload()：重新加载当前文档。（刷新）
-
-
属性
-
href：设置或返回完整的URL
-
-
-
History：历史记录对象
-
获取
window.history(可直接使用history)
-
方法
-
back()：加载history列表中的前一个URL，就跟浏览器的后退一样。 -
forward()：加载history列表中的下一个URL，就很浏览器的前进一样。 -
go(参数)：加载history列表中的某个具体页面。参数：
正数：前进n个历史记录
负数：后退n个历史记录
-
-
属性
length：返回当前窗口历史列表表中的URL数量。
-
-
二.DOM
-
概念
DOM，全称是Document Object Model 文档对象模型
DOM是将标记语言文档(比如HTML)的各个组成部分封装为对象，可以操作这些对象，来对文档进行CRUD(增删改查)。
-
W3C DOM标准分类
-
核心DOM ：针对任何结构化文档的标准模型
包含了：
-
Document：文档对象
-
创建：在html dom模型中使用window对象获取。
window.document 或者 document
-
方法
获取Element对象：
-
getElementById()：根据id属性值获取元素对象。 -
getElementByTagName()：根据标签名获取元素对象（不止一个，返回值是一个数组） -
getElementByClassName()：根据Class属性值获取元素对象，返回值是一个数组。 -
getElementByName()：根据name属性获取元素对象，返回值是一个数组。
创建其他DOM对象：
-
createAttribute(name)：方法创建并返回一个新的属性节点 -
createComment()：方法用来创建并返回一个注释节点 -
createElement(tagName)：方法用于创建一个由标签名称 tagName 指定的 HTML 元素 -
createTextNode(data)：创建一个新的文本节点
-
-
-
Element：元素对象
- 创建(获取)：通过document来获取和创建
- 方法：
-
removeAttribute()：删除属性 -
setAttribute()：设置属性
-
-
Attribute：属性对象
-
Text：文本对象
-
Comment：注释对象
-
Node：节点对象，以上五个的父对象
-
特点：所有dom对象都可以认为是一个节点
-
方法：（增删改查 dom树）
-
appendChild()：向节点的子节点列表的结尾添加新的子节点 -
removeChild()：删除（并返回）当前节点的指定子节点 -
replaceChild()：用新节点替换一个子节点
-
-
属性：
parentNode：返回父节点
-
-
-
XML DOM：针对XML文档的标准模型
-
HTML DOM：针对HTML文档的标准模型
-
三.事件
JavaScript常见的事件有以下一些：
-
点击事件
-
onclick：单击事件 -
ondblclick：双击事件
-
-
焦点事件
-
onblur：失去焦点事件，一般用于表单验证 -
onfocus：元素获得焦点
-
-
加载事件
-
onload：页面加载完成
-
-
鼠标事件
-
onmousedown：鼠标按钮被按下定义方法时，定义一个形参，接收event对象。
event对象的button属性可以获取鼠标按钮键被点击了：0是左键，1是滚轮，2是右键
-
onmouseup：鼠标按键被松开 -
onmousemove：鼠标移动到某元素之上 -
onmouseout：鼠标从某元素移开 -
onmousemove：鼠标被移动
-
-
键盘事件
-
onkeydown：某个键盘按键被按下定义方法时，定义一个形参，接收event对象。
event对象的key属性可以获取键盘的键值。
-
onkeyup：某个键盘按键被松开 -
onkeypress：某个键盘按键被按下并松开
-
-
选择和改变
-
onchange：域的内容被改变 -
onselect：文本被选中
-
-
表单事件
-
onsubmit：确认按钮被点击可以阻止表单的提交：方法返回false则表单被阻止提交。
-
onreset：重置按钮被点击
-
网友评论