《JavaScript DOM编程艺术（第2版）》笔记

《JavaScript DOM 编程艺术（第2版）》笔记

第1章：JavaScript 简史

• JavaScript 的起源

JavaScript 是 Netscape 公司和 Sun 公司合作开发的。

• DOM

DOM 是一套对文档的内容进行抽象和概念化的方法。

• 浏览器战争

今天，几乎所有的浏览器都内置了对 DOM 的支持，只要遵循 DOM 标准，就可以放心大胆的去做。

第2章：JavaScript 语法

• 语句

  建议在每条语句末尾都加上分号。

• 注释

  // 单行注释
  /* 多行注释
     多行注释*/

• 变量

  var mood = "happy";
  var age = 33;

• 数据类型

  • 字符串
  • 数值
  • 布尔值

  • 数组

    • 数组
    • 关联数组
  • 对象
• 操作符
• • 算术操作符

  + ,-,*,/,++,--,+=

• • 比较操作符

  >,=,<,>=,<=,==,!=,===.......

  ==并不表示严格相等，认为 false 与 "" 表示的含义相同。

  false == '';
  // true

  === 进行严格比较，不仅比较值，而且比较变量的类型。

  false === '';
  // false

  • 逻辑操作符

• 条件语句和循环语句

  if (condions) {
      statemen}

  • while循环

    while (conditions) {
        statements;
    }

  • for 循环

• 函数与对象

  • 函数：

  function name(arguments) {
      statements;
  }

  • 对象(object)：

  对象是一种非常重要的数据类型。

对象的两种访问形式：

• 属性 Object.property

• 方法 Object.method()

  宿主对象：在Web应用中就是由浏览器提供的预定义对象。

第3章：DOM

DOM：

• 文档：D (document)

• 对象：O(object)

  • 用户定义对象
  • 内建对象：如 Array,Math,Data等。
  • 宿主对象：由浏览器提供的对象。
• 模型: M(model)

节点(node)：

• 元素节点
• 文本节点
• 属性节点

获取元素：

• getElementById
• getElementsByTagName
• getElementsByClassName

获取属性：

• getAttribute

设置属性：

• setAttribute

第4章：案例研究：JavaScript图片库

介绍了 DOM 提供的几个新属性：

• childNodes
• nodeType
• nodeValue
• firstChild
• lastChild

第5章：最佳实战

平稳退化

平稳退化(graceful degradation)：正确使用 JavaScript 脚本，可以让访问者在他们的浏览器不支持 JavaScript 的情况下仍然能顺利地浏览你的网站。

不能平稳退化会影响你的网页在搜索引擎上的排名。

• "javascript:" 伪协议：这种做法非常不好

  • 真协议：用来在因特网上的计算机之间传输数据包，如HTTP协议(http://)、FTP协议(ftp://)等。

  • 伪协议：非标准化的协议。

    // 用"javascript:" 伪协议调用 popUp()函数：
    Example

• 内嵌的事件处理函数

  Example

  非常不好，因为#只是创建了一个空链接。

• 平稳退化办法：将 href 属性设置为真实存在的 URL 地址，让它成为一个有效的链接。

  Example

  这样，即使 javascript 被禁止，这个链接也是可用的。

渐进增强

渐进增强就是用一些额外的信息层去包裹原始数据。

按照“渐进增强”原则创建出来的网页几乎都符合“平稳退化”原则。

结构、样式、行为要分离。

向后兼容

• 对象检测

  // 例如
  if (!document.getElementById) {
      return false;
  }

• 浏览器嗅探技术

  通过提取浏览器供应商提供的信息来解决向后兼容问题。

性能考虑

• 尽量少访问DOM和尽量减少标记

• 合并和放置脚本

  • 推荐把 functionA.js,functionB.js,functionC.js合并到一个脚本文件中，这样可以减少加载页面时发送的请求数量。
  • 把