JavaScript的学习要点

概要

了解Javascript历史以及Javascript三个不同组成部分：

1. ECMAScript
2. DOM（文档对象模型）
3. BOM（浏览器对象模型）

ECMAScript

1. 目标

   掌握Javascript语法，熟悉对象的定义和使用，能熟练使用Javascript进行web开发。

2. 要点

   1. 了解ECMAScript历史以及浏览器支持情况

   2. 基本语法

      • 语句
      • 运算符

      • 数据类型

        • 值类型，也就是原始类型：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
   3. 函数的定义和使用，闭包的理解
   4. 对象的定义和使用
   5. 对象的继承
3. 参考资源
1. Javascript高级教程
2. 对象的继承实现

DOM（主要学习HTML DOM）

1. 目标

   掌握HTML DOM定义的访问HTML元素的对象和基本属性，以及访问它们的基本方法；了解浏览器的差异；熟练使用Javascript操作HTML元素。

2. 要点
   • 掌握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(){};
     • 基本事件及处理函数中接受的参数：事件对象（Event）：
       • 基本事件
         • 鼠标事件：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(): 不再派发事件。
       • 了解事件冒泡机制，学会如何利用冒泡来开发；了解如何阻止冒泡、阻止默认行为
3. 参考资源
   1. HTML DOM教程
   2. HTML DOM Event 对象

BOM

1. 目标

   掌握BOM中提供的一些基本对象意义及使用，能熟练利用这些对象进行Web开发。

2. 要点
   • BOM概念及作用
   • 对于Window, Navigator, Screen, History, Location对象作一个基本了解。