blog
blog copied to clipboard
thinkerchan
javascript高级程序设计(第三版) 快速阅读版，省略较多不常用的内容。
## 可维护性 可维护性并不是js专有, 其他语言也有这么个说法, 可维护性最大的价值是让别人更好的在你代码的基础上维护和增减功能 ### 什么是可维护的代码 通常写入注释是为了让其他人更好地看懂自己写了啥, 不过我相信一条原则, 写的好的代码, 本身就是注释, 可维护的代码有以下几个特征: - 可理解: 容易被理解 - 直观: 直观可读 - 可适应: 代码以一种数据上的变化不需要完全重写原来的方法 - 可扩展: 在某种程度上考虑到将来要用到的功能 - 可调试 ### 代码约定 团队开发中通常约定代码风格, 例如缩进,...
保持离线 Web 应用开发是 HTML5 的另一个重点。所谓离线 Web 应用，就是在设备不能上网的情况下仍然可以运行的应用。 开发离线 Web 应用需要几个步骤。首先是确保应用知道设备是否能上网，以便下一步执行正确的操作。然后，应用还必须能访问一定的资源（图像、JavaScript、CSS 等），只有这样才能正常工作。最后，必须有一块本地空间用于保存数据，无论能否上网都不妨碍读写。HTML5 及其相关的 API 让开发离线应用成为现实。 ## 离线检测 HTML5提供了这个API检测设备是否离线: ``` js var isOn = navigator.onLine; // true or false ``` 除 navigator.onLine...
Ajax，是对 Asynchronous JavaScript + XML 的简写。 Ajax 技术的核心是 XMLHttpRequest 对象（简称 XHR），这是由微软首先引入的一个特性，其他浏览器提供商后来都提供了相同的实现。在 XHR 出现之前，Ajax 式的通信必须借助一些 hack 手段来实现，大多数是使用隐藏的框架或内嵌框架。XHR 为向服务器发送请求和解析服务器响应提供了流畅的接口。能够以异步方式从服务器取得更多信息，意味若用户单击后，可以不必刷新页面也能取得新数据。也就是说，可以使用 XHR 对象取得新数据，然后再通过 DOM 将新数据插入到页面中。 另外，虽然名字中包含 XML 的成分，但 Ajax 通信与数据格式无关；这种技术就是无须刷新页面即可从服务器取得数据，但不一定是 XML 数据。 ## XMLHttpRequest对象...
在很早一段时间, XML才是WEB开发首选的数据结构, 但是JSON的出现改变了这个事实, 相比XML, JSON更加简洁, 逻辑清晰, 读取信息的时候, 也不必创建DOM对象. 所以当下JSON是web开发最流行的数据格式. ## 语法 JSON 的语法可以表示以下三种类型的值。 - 简单值：使用与 JavaScript 相同的语法，可以在 JSON 中表示字符串、数值、布尔值和 null。但 JSON 不支持 JavaScript 中的特殊值 undefined。 - 对象：对象作为一种复杂数据类型，表示的是一组无序的键值对儿。而每个键值对儿中的值可 以是简单值，也可以是复杂数据类型的值。 - 数组：数组也是一种复杂数据类型，表示一组有序的值的列表，可以通过数值索引来访问其中...
## 表单的基础知识 ### 提交表单 ### 重置表单 ### 表单字段 ## 文本框脚本 ### 选择文本 ### 过滤输入 ### 自动切换焦点 ### HTML5约束验证API ## 选择框脚本 ### 选择选项 ### 添加选项 ### 移除选项 ### 移动和重排列 ## 表单序列化...
HTML和JS之间的交互, 就是通过事件实现的. ## 事件流 事件流描述的是从页面中接收事件的顺序. 有冒泡和捕获两种事件处理方式, 提出者为微软和网景. ### 事件冒泡 IE 的事件流叫做事件冒泡（event bubbling），即事件开始时由最具体的元素（文档中嵌套层次最深的那个节点）接收，然后逐级向上传播到较为不具体的节点（文档）。 我们看这个例子: ``` html Event Bubbling Example Click Me ``` 按照IE的逻辑, 你点击#myDive会经过一下历程: > div#myDiv -> body -> html ->...
## DOM变化 ### 针对XML命名空间的优化 ### 其他方面的优化 ## 样式 ### 访问元素的样式 ### 操作表样式 ### 元素大小 ## 遍历 ### NodeIterator ### TreeWalker ## 范围 ### DOM中的范围 ### IE8及更早版本的范围
第五章讲了函数的使用方式, 要么函数声明, 要么函数表达式. 关于函数声明, 有一个重要的特征, 就是会**函数声明提升**: ``` js sayHi(); // 这样是可以的, 如果是函数表达式 就会报错 function sayHi(){ alert("Hi!"); } ``` 因为函数声明的这个特性, 千完不要在判断语句中使用**函数声明**: ``` js // 不要这么做! if(condition){ function sayHi(){ alert("Hi!"); } }...
上一章讲了DOM相关的知识, 对此, DOM相关的API已经能满足绝大部分开发者的使用了. 但是jQuery实在是太强大, 以至于W3C对其选择器进行了参考, 而后进行了扩展. ## 选择符API ### querySelector 用法: ``` js var body = document.querySelector('body'); var id_body = document.querySelector('#body'); var class_body = document.querySelector('.body'); ``` ### querySelectorAll 用法: ```...
DOM即文档对象模型, 是针对HTML和XML的一个编程API, 主要功能是允许开发人员添加、移除和修改页面的某一部分。 ## 节点层次 DOM以节点树的形式反映: ``` html Sample Page Hello World! ``` 以上就是一个最简单的DOM树结构. 文档节点是每个文档的根节点。 在这个例子中，文档节点只有一个子节点，即元素. 称之为文档元素。文档元素是文档的最外层元素，文档中的其他所有元素都包含在文档元素中。每个文档只能有一个文档元素。在 HTML 页面中，文档元素始终都是元素。在 XML 中，没有预定义的元素，因此任何元素都可能成为文档元素。 每一段标记都可以通过树中的一个节点来表示：HTML 元素通过元素节点表示，特性（attribute） 通过特性节点表示，文档类型通过文档类型节点表示，而注释则通过注释节点表示。总共有 12 种节点类型，这些类型都继承自一个基类型。 ### Node类型 DOM1 级定义了一个...