概要
了解Javascript历史以及:
- ECMAScript
- DOM(文档对象模型)
- BOM(浏览器对象模型)
-
目标
掌握Javascript语法,熟悉对象的定义和使用,能熟练使用Javascript进行web开发。
-
要点
-
基本语法
- 语句
- 运算符
-
数据类型
-
值类型,也就是原始类型:Undefined、Null、Boolean、Number 和 String。
var a; // undefined,
var b = null; // null
var c = true; // boolean,
var d = 10; // number
var e = “my”; // string
-
引用类型:Object, Boolean, Number和String
var a = new Boolean(true);
var b = new Number(10);
var c = new String(“my”);
-
- : Boolean, Number, String, Date, Array, Math, RegExp, Function
- 的定义和使用,闭包的理解
- 的定义和使用
-
- 参考资源
DOM(主要学习HTML DOM)
-
目标
掌握HTML DOM定义的访问HTML元素的对象和基本属性,以及访问它们的基本方法;了解浏览器的差异;熟练使用Javascript操作HTML元素。
- 要点
- 掌握HTML DOM的概念:节点、属性
- 如何访问HTML元素(节点):
- 通过使用 getElementById() 方法
- 通过使用 getElementsByTagName() 方法
- 通过使用 getElementsByClassName() 方法
- 如何访问节点属性(获取、修改)、节点内容(获取、修改)
- 如何创建、删除、移动节点:
- createElement
- removeChild
- insertBefore
- appendChild
- cloneNode
- replaceChild
- 事件
- 事件的概念
- 如何给节点添加和移除事件(了解各自优缺点,建议使用推荐的方式来添加和移除事件)
- 直接在HTML元素上添加、移除事件
- 利用Javascript给节点添加、移除事件(了解不同浏览器的差异: Chrome, Firefox, IE(IE9之前和IE9之后不同))
- attachEvent和addEventListener(推荐)
- detachEvent和removeEventListener(推荐)
- 通过修改节点事件属性:htmlElement.onclick = function(){};
- 基本事件及处理函数中接受的参数::
- 基本事件
- 鼠标事件:onmousedown, onmouseup, onclick, ondblclick, onmousemove, onmouseover, onmouseout
- 键盘事件:onkeydown, onkeypress, onkeyup
- 焦点事件:onfocus, onblur
- 其他事件:onload, onchange
- Event对象的属性和方法
- target
- clientX, clientY, screenX, screenY
- altKey, shiftKey
- button
- keyCode(for IE), which(for Chrome, Firefox)
- preventDefault(): 通知浏览器不要执行与事件关联的默认动作
- stopPropagation(): 不再派发事件。
- ;了解如何阻止冒泡、阻止默认行为
- 基本事件
- 参考资源
- 目标
掌握BOM中提供的一些基本对象意义及使用,能熟练利用这些对象进行Web开发。
- 要点
- BOM概念及作用
- 对于Window, Navigator, Screen, History, Location对象作一个基本了解。