第1章 从网站重构说起 1
1.1 糟糕的页面实现,头疼的维护工作 2
1.2 Web标准——结构、样式和行为的分离 4
1.3 前端的现状 6
1.4 打造高品质的前端代码,提高代码的可维护性——精简、重用、有序 8
第2章 团队合作 9
2.1 揭秘前端开发工程师 10
2.2 欲精一行,必先通十行 13
2.3 增加代码可读性——注释 15
2.4 提高重用性——公共组件和私有组件的维护 15
2.5 冗余和精简的矛盾——选择集中还是选择分散 16
2.6 磨刀不误砍柴工——前期的构思很重要 17
2.7 制订规范 18
2.8 团队合作的最大难度不是技术,是人 18
第3章 高质量的HTML 19
3.1 标签的语义 20
3.2 为什么要使用语义化标签 21
3.3 如何确定你的标签是否语义良好 26
3.4 常见模块你真的很了解吗 36
3.4.1 标题和内容 36
3.4.2 表单 38
3.4.3 表格 40
3.4.4 语义化标签应注意的一些其他问题 43
第4章 高质量的CSS 44
4.1 怪异模式和DTD 45
4.2 如何组织CSS 46
4.3 推荐的base.css 49
4.4 模块化CSS——在CSS中引入面向对象编程思想 55
4.4.1 如何划分模块——单一职责 55
4.4.2 CSS的命名——命名空间的概念 60
4.4.3 挂多个class还是新建class——多用组合,少用继承 66
4.4.4 如何处理上下margin 72
4.5 低权重原则——避免滥用子选择器 81
4.6 CSS sprite 85
4.7 CSS的常见问题 88
4.7.1 CSS的编码风格 88
4.7.2 id和class 89
4.7.3 CSS hack 89
4.7.4 解决超链接访问后hover样式不出现的问题 93
4.7.5 hasLayout 94
4.7.6 块级元素和行内元素的区别 95
4.7.7 display:inline-block和hasLayout 97
4.7.8 relative、absolute和float 103
4.7.9 居中 104
4.7.10 网格布局 112
4.7.11 z-index的相关问题以及Flash和IE 6下的select元素 122
4.7.12 插入png图片 129
4.7.13 多版本IE并存方案——CSS的调试利器IETester 131
第5章 高质量的JavaScript 133
5.1 养成良好的编程习惯 134
5.1.1 团队合作——如何避免JS冲突 134
5.1.2 给程序一个统一的入口——window.onload和DOMReady 148
5.1.3 CSS放在页头,JavaScript放在页尾 159
5.1.4 引入编译的概念——文件压缩 160
5.2 JavaScript的分层概念和JavaScript库 162
5.2.1 JavaScript如何分层 162
5.2.2 base层 163
5.2.3 common层 181
5.2.4 page层 184
5.2.5 JavaScript库 185
5.3 编程实用技巧 187
5.3.1 弹性 187
5.3.2 getElementById、getElementsByTagName和getElements-ByClassName 193
5.3.3 可复用性 196
5.3.4 避免产生副作用 199
5.3.5 通过传参实现定制 203
5.3.6 控制this关键字的指向 207
5.3.7 预留回调接口 211
5.3.8 编程中的DRY规则 212
5.3.9 用hash对象传参 215
5.4 面向对象编程 217
5.4.1 面向过程编程和面向对象编程 217
5.4.2 JavaScript的面向对象编程 224
5.4.3 用面向对象方式重写代码 245
5.5 其他问题 251
5.5.1 prototype和内置类 251
5.5.2 标签的自定义属性 255
5.5.3 标签的内联事件和event对象 260
5.5.4 利用事件冒泡机制 263
5.5.5 改变DOM样式的三种方式 267
附录A 写在规则前面的话 271
附录B 命名规则 272
附录C 分工安排 274
附录D 注释规则 276
附录E HTML规范 278
附录F CSS规范 280
附录G JavaScript规范 282