计算机 / 读书笔记 · 2022年8月10日 0

Professional JavaScript for Web Developers, 3rd Edition, Part 1

第一章 JavaScript简介

JavaScript实现包括三部分：

  • 核心，ECMAScript
  • 文档对象模型，DOM
  • 浏览器对象模型，BOM

ECMAScript

EcmaScript的常见宿主环境：

web浏览器，Node，Adobe Flash。

ECMA-262标准只定义了语言的基础，连输入输出都没有定义，输入输出由宿主环境提供。

DOM

DOM1级的目标主要是映射文档的结构。

DOM2级引入了下列新模块：

  • DOM视图(DOM Views)，定义了跟踪不同文档(例如，应用CSS之前和之后的文档)视图的接口；
  • DOM事件(DOM Events)，定义了事件和事件处理的接口；
  • DOM样式(DOM Style)，定义了基于CSS为元素应用样式的接口；
  • DOM遍历和范围(DOM Traversal and Range)，定义了遍历和操作文档树的接口；

DOM3进一步扩展了DOM，引入了：

  • DOM Load and Save，以统一方式加载和保存文档的方法；
  • DOM Validation，验证文档的方法；
  • 支持XML 1.0规范，涉及XML Infoset，XPath和XML Base。

其他DOM标准

  • SVG
  • MathML
  • SMIL，Synchronized Multimedia Integration Language，同步多媒体集成语言

BOM

从根本上讲，BOM只处理浏览器窗口和框架，但习惯上人们也把针对浏览器的一些JavaScript扩展算作DOM的一部分：

  • 弹出新浏览器窗口；
  • 移动、缩放和关闭浏览器窗口；
  • 提供浏览器详细信息的navigator对象；
  • 提供浏览器所加载页面详细信息的location对象；
  • 提供用户显示器分辨率详细信息的screen对象；
  • 对cookies的支持；
  • 像XMLHttpRequest和IE的ActiveXObject这样的自定义对象。

BOM没有标准，每个浏览器有自己的实现。

第二章 在HTML中使用JavaScript

HTML4.01为<script>元素定义的6个属性：

  • async，表示应该立即下载该脚本，但不应妨碍页面中的其他操作，比如下载其他资源或等待加载其他脚本；只对外部脚本文件有效；
  • charset，表示通过src属性指定的代码的字符集。大多数浏览器会忽略它的值。
  • defer，表示脚本可以延迟到文档完全被解析和显示之后再执行，只对外部脚本文件有效。
  • language，已废弃，表示编写代码使用的脚本语言。
  • src，表示包含要执行代码的外部文件。
  • type，可选，language属性的替代属性，考虑到最大兼容性应该使用”text/javascript”，也可以不指定这个属性，默认值仍然是”text/javascript”。

javascript代码的嵌入方式

第一种直接将代码写在<script>标签内，浏览器是按顺序解析整个页面内容的，所以在解释器对<script>元素内部的所有代码求值完毕以前，不会加载和显示页面中的其余内容。代码中不能直接包含</script>这个字符串，而必须转义，写成<\/script>。

第二种是通过src属性包含外部javascript文件，此时<script>标签内部的代码将会忽略。解析src属性引入的外部代码文件时，页面的剩余部分也会暂停处理。如果是XHTML文档中，可以将<script>标签的闭合标签省略，直接写为：<script type=”text/javascript” src=”example.js” />。

无论如何包含代码，只要不存在defer和async属性，浏览器都会按照<script>元素在页面中出现的先后顺序对它们依次进行解析。

script标签的位置

<script>标签可以放在<head>标签里，或者放在</body>闭合标签前面，放在<head>标签里时会先加载javascript文件再显示页面内容(前提是没有设置defer或者async属性)，放在</body>闭合标签前面会先显示页面内容再解析javascript文件。

defer属性

设置defer属性时，脚本会被延迟到整个页面都解析完毕后再执行(但是仍然会立即下载javascript文件)。按照HTML5规范，多个设置defer属性的脚本会按顺序执行，并且先于DOMContentLoaded事件执行，但是这个规范并不一定被严格遵守。所以最好只包含一个设置defer属性的脚本。

defer属性只适用于外部脚本文件。

早期浏览器不支持defer属性，所以把延迟脚本放在页面底部兼容性更好。

async属性

async属性只适用于外部脚本文件。

多个异步脚本之间不能假定执行顺序。

异步脚本不要在加载期间修改DOM(避免修改DOM时浏览器正在加载页面内容或者其他异步脚本在修改DOM)。

异步脚本一定会在页面的load事件前执行。

文档模式

可以通过doctype指定解析页面时使用的标准。

<!-- HTML 5 -->
<!DOCTYPE html>

文档模式分为混杂模式(quirks mode)和标准模式(standards mode)。还有一种准标准模式(almost standards mode)，不过和标准模式也没什么大的区别。

<noscript>元素

如果浏览器不支持JavaScript，那么浏览器会显示页面中的<noscript>标签。<noscript>标签可以包含<script>以外的任何元素。

标签：

发表回复