14、JS介绍

JavaScript的组成

JS由三部分组成：

• ECMAScript（核心）：规定了JS的语法和基本对象；
• DOM：文档对象模型，处理网页内容的方法和接口；
• BOM：浏览器对象模型，与浏览器交互的方法和接口。

BOM对象概述

BrowserObjectModel浏览器对象模型，window代表了BOM对象。window对象是js的内置对象，使用window对象调用方法可以省略window不写。

• 消息框
  • alert( )
  • confirm( )
• Location对象
  • 常用属性：href ：设置或返回完整的 URL。

DOM对象概述

DocumentObjectModel文档对象模型。文档指标记型文档（HTML等），DOM是将标记型文档中所有内容（标签、文本、属性）都封装成对象，通过操作对象的属性和方法，来达到操作或改变HTML展示效果的目的。

• DOM树
  
  
• 获取元素对象的四种方式
  • getElementById()
  • getElementByName()
  • getElementByTagName()
  • getElementByClassName()
• 获取元素对象的注意事项
  • 获取元素节点对象，必须保证元素对象先加载到内存当中。把script标签放在body标签结束上方。
• 元素对象常见属性
  • value 获取/修改元素值
  • className 获取/修改元素样式
  • checked 修改单选/复选的选中与否
  • innerHTML 获取/修改元素内容体

JS事件

通常鼠标或者热键的动作称之为事件（Event）。通过js事件，完成页面指定特效。

• JS事件驱动机制
  • 事件源：小偷
  • 事件：偷东西
  • 监听器：警察
  • 注册/绑定监听器：让警察时刻盯着小偷
• 常见的JS事件
  • onclick：点击事件
  • onfocus：获取焦点事件
  • onblur：失去焦点事件（注册时检查用户名是否重复）
  • onchange：域内容改变事件
  • onload：加载完毕事件
  • onsubmit：表单提交事件（用于表单校验）
  • onkeyup：键位弹起事件
  • onmouseover鼠标移入事件
  • onmouseup鼠标移出事件

JS事件绑定方式

• 元素事件句柄绑定

• DOM绑定方式（HTML代码和脚本代码高度分离，便于开发及维护）
  • 对象.事件函数(方便快捷)
    window.οnlοad=run1;
  • 匿名函数(可以传参、一次绑定多个)
    window.οnlοad=function(){
    run1();
    run2();
    }