javascript_BOM&DOM&JSON

JavaScript = ECMAScript + BOM + DOM

BOM: Browser Object Model 浏览器对象模型

* 浏览器对象模型：将浏览器的各个组成部分封装成对象。

Window ：浏览器的窗口

History ：历史记录对象
back() 加载 history 列表中的前一个 URL。
forward() 加载 history 列表中的下一个 URL。
go() 加载 history 列表中的某个具体页面。
* 参数：
* 字符串：历史记录中存在的URL
* 数字：
* 正数：前进几个位置
* 负数：后退几个位置

Location ：地址栏对象
* 属性：
href：获取或设置地址栏的URL

Navigator ：浏览器对象
Screen ：显示器对象

DOM: Document Object Model 文档对象模型

* 文档对象模型：当标记语言文当一加载进内存，就将标记语言文档的各个组成部分封装为对象。

* Document：文档对象
* Element：元素对象
* Attribute：属性对象
* Text：文本对象
* Comment：注释对象

* Node：节点对象

事件：

* 概念：

* 事件：一件事

* 事件源：一个组件

* 监听器：一个对象。

* 注册监听：将监听器对象和事件源相绑定

* 绑定方式：
* 给组件添加 属性(与事件名称有关)，属性的值是js代码
如：<input type="button" value="点我" onclick="fun();"/>
* 获取组件对象，给组件对象添加属性。属性值是函数对象
document.getElementById("btn").onclick = function(){
alert(123);
}
* 事件的种类：
* 焦点事件：
onfocus 元素获得焦点。
onblur 元素失去焦点。
* 点击事件：
onclick 当用户点击某个对象时调用的事件句柄。
ondblclick 当用户双击某个对象时调用的事件句柄。
* 键盘事件：
onkeydown 某个键盘按键被按下。
onkeyup 某个键盘按键被松开。
onkeypress 某个键盘按键被按下并松开。
* 注意：要想获取哪个键被按下了，需要在方法中定义一个参数，来接受Event对象。通过该对象的keyCode属性获取按键对应的unicode码
* 鼠标事件
onmousedown 鼠标按钮被按下。
onmouseup 鼠标按键被松开。
onmouseover 鼠标移到某元素之上。
onmouseout 鼠标从某元素移开。
onmousemove 鼠标被移动。

* 表单专属事件：
onsubmit 确认按钮被点击。
* 在属性值中返回一个返回值：
* false：不提交
* true&不返回： 提交表单
onreset 重置按钮被点击。

* 加载事件：
onload 一张页面或一幅图像完成加载。
onunload 用户退出页面。
* 其他事件：
onchange 域的内容被改变。
onselect 文本被选中。

案例：

* 表单验证

* 优点：

1：提高用户体验。

2：减轻服务器端的压力

JSON：JavaScript Object Notation JavaScript 对象表示法

* 格式：

1：{键:值,键:值….} {“name”:”zhangsan”,”age”:23,”gender”:”male”}

* 键：字符串格式

* 值：任意类型。

2: [值1,值2…] [{“name”:”zhangsan”,”age”:23,”gender”:”male”},{“name”:”zhangsan”,”age”:23,”gender”:”male”}]

* 通过这两种基本的格式可以组合成复杂格式。
* 获取json数据：
* 引用.键名
* 引用["键名"]