HTML5&CSS3&JavaScriptApp程序开发实战

本书是针对HTML5、CSS3、JavaScript，以及使用前述三大技术来开发Windows Store App，共四个方向为出发点所编写，本书章节在内容安排上，将会先由HTML谈起，接着介绍CSS3、HTML5及JavaScript，最后再以Windows Store App实例作为本书的结束，期望带领读者们从基础入门开始学起，最后再配合实务开发，让您具有一个完整的学习体验之旅。

周忠慶（Clark）中华科技大学毕业，拥有多年ASP.NET Web应用开发经验，专长为面向对象架构设计。陈葵懋（Ian Chen）高雄师范大学信息教育研究所硕士，专长为ASP.NET Web应用开发，目前为资深程序设计师，也是Microsoft最有价值专家（MVP）。

第1章 HTML的基础
1-1 HTML 创建与运行 2
1-1-1 HTML 创建 .2
1-1-2 HTML 运行 .3
1-2 HTML API 概念 6
1-2-1 API 概念.6
1-2-2 静态引用 7
1-2-3 动态引用 8
1-3 HTML 根节点 . 10
1-3-1 window 对象 10
1-3-2 全局根节点 . 11
1-3-3 document 属性 .14
1-3-4 onload 事件15
1-4 HTML 标签 16
1-4-1 标签组成 16
1-4-2 文件组成 18
1-4-3 script 标签 20
1-4-4 script 标签的运行顺序 .22
1-4-5 style 标签及 link 标签 .25
1-4-6 HTML5 新增标签 27
1-5 HTML 网页与 ASP.NET网页 . 30
1-5-1 HTML 网页 .30
1-5-2 ASP.NET 网页 32
第2章 CSS的基础
2-1 CSS 样式 . 40
2-1-1 样式组成 40
2-1-2 样式套用 42
2-1-3 样式继承 44
2-1-4 样式重设 46
2-2 CSS 选择器 . 48
2-2-1 选择器概念 .48
2-2-2 Type 选择器 .50
2-2-3 ID 选择器 .51
2-2-4 Class 选择器 52
2-2-5 Universal 选择器 53
2-2-6 Attribute 选择器 53
2-2-7 Child 组合器 .56
2-2-8 Descendant 组合器 57
2-2-9 General Sibling 组合器 .58
2-2-10 Adjacent Sibling 组合器 60
2-2-11 Grouping 组合器 .61
2-3 CSS 盒子模型 62
2-3-1 盒子模型概念 .62
2-3-2 margin 属性 .64
2-3-3 border 属性 66
2-3-4 padding 属性 68
2-3-5 width 属性、height 属性 .70
2-4 CSS 定位模式 71
2-4-1 定位模式概念 .71
2-4-2 display 属性 .78
2-4-3 overflow 属性 .83
2-4-4 z-index 属性 .88
2-5 CSS 排版布局 91
2-5-1 排版布局概念 .91
2-5-2 满版 100% 布局 .91
2-5-3 满版分列布局 .93
2-5-4 满版分行布局 .95
2-5-5 水平居中布局 .96
2-5-6 垂直居中布局 .98
2-5-7 固定居中布局 .99
第3章 DOM——文件对象模型
3-1 DOM 模型 104
3-1-1 DOM 概念 104
3-1-2 DOM 对象树 .105
3-1-3 document 对象 .107
3-1-4 DOM 节点 115
3-2 DOM 节点选择 . 123
3-2-1 节点选择概念 .123
3-2-2 getElementById 方法 .126
3-2-3 getElementsByTagName 方法 127
3-2-4 querySelector、querySelectorAll 方法 128
3-2-5 childNodes、parentNode 属性 .132
3-3 DOM 节点操作 . 135
3-3-1 节点操作概念 .135
3-3-2 style 属性 .135
3-3-3 appendChild 方法 140
3-3-4 setAttributeNode 方法 142
3-3-5 removeChild 方法 144
3-3-6 removeAttributeNode 方法 .146
3-4 DOM 节点事件 . 149
3-4-1 节点事件概念 .149
3-4-2 节点事件通知 .150
3-4-3 addEventListener 方法 .151
3-4-4 removeEventListener 方法 .155
第4章 全新HTML5基础
4-1 HTML5 概念 160
4-1-1 HTML 优势 .160
4-1-2 HTML4 困境 .161
4-1-3 HTML5 升级 .163
4-1-4 HTML 标签升级 163
4-1-5 CSS 样式升级 165
4-1-6 DOM 模型升级 .166
4-1-7 HTML API 升级 167
4-2 HTML5 图像描绘 169
4-2-1 功能说明 169
4-2-2 canvas 标签 .170
4-2-3 路径描绘 172
4-2-4 文字描绘 175
4-2-5 颜色描绘 176
4-2-6 图片描绘 179
4-2-7 图片加载 181
4-2-8 图片输出 183
4-2-9 GPU加速185
4-3 HTML5 影音播放 185
4-3-1 功能说明 185
4-3-2 video 标签 187
4-3-3 视频格式 189
4-3-4 视频操作 190
4-3-5 视频事件 192
4-3-6 视频截图 194
4-3-7 audio 标签 .197
4-4 HTML5 数据存储 198
4-4-1 功能说明 198
4-4-2 storage 对象 200
4-4-3 访问操作 203
4-4-4 访问范围 206
4-4-5 跨页传值 208
4-5 HTML5 数据传输——服务器推送 208
4-5-1 功能说明 208
4-5-2 HTTP 通信协议 210
4-5-3 服务器推送机制 214
4-5-4 服务器推送数据包 .215
4-5-5 EventSource 对象 217
4-5-6 数据接收 219
4-5-7 断线重连 223
4-6 HTML5 数据传输——双向传输 . 226
4-6-1 WebSocket 通信协议 226
4-6-2 WebSocket 通信数据包 228
4-6-3 WebSocket 对象 230
4-6-4 数据传送 235
4-6-5 数据接收 239
第5章 必知的JavaScript语言
5-1 JavaScript 概念 . 246
5-1-1 概念 .246
5-1-2 全局变量 246
5-1-3 局部变量 247
5-1-4 函数 .249
5-1-5 对象 .251
5-1-6 原型 .255
5-1-7 闭包 .258
5-2 JavaScript 面向对象 . 259
5-2-1 概念 .259
5-2-2 类 260
5-2-3 封装 .261
5-2-4 继承 .262
5-2-5 多态 .264
5-2-6 静态成员 266
5-2-7 命名空间 268
5-3 JavaScript 架构设计 . 269
5-3-1 概念 .269
5-3-2 三层式架构 .269
5-3-3 架构设计 270
5-3-4 逻辑层实现 .273
5-3-5 数据层实现 .275
5-3-6 展示层实现 .276
第6章 Windows Store App开发概念
6-1 Windows Store App 概观 . 283
6-2 开发第一步：取得开发人员授权 290
6-3 Windows Store App 项目模板及架构 . 292
6-3-1 空白应用程序模板 ( Blank App ) 294
6-3-2 网格应用程序模板 ( Grid App ) 301
6-3-3 拆分布局应用程序模板 ( Split App ) .316
6-3-4 固定配置的应用程序模板 ( Fixed-Layout App ) 321
6-3-5 浏览应用程序模板 ( Navigation App ) 323
6-4 应用程序协议及应用程序生命周期 . 325
6-4-1 应用程序周期 .325
6-4-2 启动运行 326
6-4-3 暂停 .328
6-4-4 恢复运行 330
6-4-5 终止 .331
6-4-6 关闭 .333
6-4-7 意外关闭 334
6-4-8 其他的 WinJS 事件 .334
6-4-9 应用程序协议 ( App Contracts ) 336
6-4-10 设置协议 ( Settings Contract ) 338
6-4-11 共享目标协定 ( Share Contract ) .347
6-4-12 搜索协议 ( Search Contract ) 351
第7章 使用JavaScript和HTML5实作Windows Store App
7-1 Windows Runtime Library 概观 362
7-2 WinJS ( Windows Library for JavaScript ) 概观 371
7-2-1 如何引用 WinJS Library382
7-2-2 如何引用外部第三方 JavaScript Library 386
7-2-3 开发上的差异 .390
7-3 WinJS 控件介绍 . 411
7-3-1 什么是 WinJS 控件 . 411
7-3-2 常用控件 423
7-3-3 数据集合控件 .449
7-4 实作Windows Store App案例 456
7-4-1 Windows Store App 的内容及重点功能 .457
7-4-2 Windows Store App UI 的设计 458
7-4-3 Windows Store App 数据的设计 467
7-4-4 页面查看的整合调整 .473
7-4-5 加入数据维护功能 .484
7-4-6 搜索、分享协议 495
7-5 如何将 Windows Store App上架至
Windows 应用商店 . 501
7-5-1 注册取得开发人员账户 501
7-5-2 使用 Windows 应用程序认证包测试应用程序 .508
7-5-3 封装应用程序 .513
7-5-4 上架送审 517
附录 参考资料

本书是针对HTML5、CSS3、JavaScript，以及使用前述三大技术来开发Windows Store App，共四个方向为出发点所编写，随着浏览器支持度越来越高，对于大部分的前端网页开发人员来说，HTML5应该是近期相当受到注目的一个课题。此外，原先在传统窗口界面的应用程序开发领域里，前端网页开发人员几乎无法以自身已熟知的技术能力参与其中。然而，随着Windows Store App的出现，这个限制已被打破，HTML5、CSS3及JavaScript可以被用来开发Windows Store App，因此，前端网页开发人员得以跨越以往的藩篱，进入窗口界面应用程序的开发领域中，这无疑是为前端网页开发人员打开了更广阔的航道。
本书章节在内容安排上，将会先由HTML谈起，接着介绍CSS3、HTML5及JavaScript，最后再以Windows Store App实例作为本书的结束，期望带领读者们从基础入门开始学起，最后再配合实务开发，让您具有一个完整的学习体验之旅。
Chapter 1 HTML的基础
运行在浏览器上的网页是由HTML所构成，HTML可以说是网页的骨架，开发人员创建的网页必须要使用HTML的标签，才能在浏览器上呈现给用户使用。本章将介绍HTML的创建与运行，并对于开发网页时会接触到的主要标签、API引用、对象节点、HTML与Web关系进行说明。
Chapter 2 CSS的基础
如果说HTML是网页的骨架，那么CSS就可以说是网页的皮肤，开发人员创建的网页必须要通过CSS的装饰才能吸引用户的目光。本章将介绍样式的组成与套用，并针对开发时最常使用的选择器、盒子模型、定位模式进行说明，也会在最后一个小节介绍各种排版布局的基础模板。
Chapter 3 DOM──文件对象模型
HTML与CSS构成了网页的骨架与皮肤，而DOM则是用来提供开发人员通过程序代码更改HTML与CSS的工具。本章将介绍DOM模型的概念与使用，并对于开发时最常使用的节点选择、节点操作、节点事件进行说明。
Chapter 4 全新HTML5基础HTML是一个不断在升级的标签语言，目前正在从HTML4往HTML5的方向升级。本章将介绍HTML5的概念，并对HTML5所提供的影像描绘、影音播放、数据存储、数据传输等实用又有趣的新功能进行说明。
Chapter 5 必知的JavaScript语言
JavaScript是种介于面向过程、面向对象之间的程序语言，是一种简单、好用、十分灵活的开发工具。本章将介绍JavaScript的各种语言特性，并对于JavaScript如何实现面向对象中的封装、继承、多态等概念进行说明，也会在最后一个小节介绍如何在JavaScript上实现软件架构的设计。
Chapter 6 Windows Store App 开发概念
Windows Store App在Windows 8平台是一种新形态的应用程序。本章将介绍何谓Windows Store App，以及开发Windows Store App所应事先准备的环境和工具，并针对现行开发工具Visual Studio 2013所内置的项目模板架构逐一说明，接着介绍关于Windows Store App的应用程序生命周期及应用协议，为实际开发打下基础。
Chapter 7 使用JavaScript和HTML5实作Windows Store App
本章将介绍以HTML5＋JavaScript开发Windows Store App两大主轴核心Windows Runtime Library及Windows Library for JavaScript，并介绍如何使用WinJS控件，最后会以实际开发范例，由开发到正式送审上架做一个完整的示范说明。
范例程序与工具说明
本书在编写范例程序代码时，所采用的开发工具是Visual Studio 2013，若您是由微软官方网站下载免费开发版本，要注意必须选择Express forWindows 版本。另外，要特别提醒您，本书第6章及第7章的部分，由于是在介绍Windows Store App的开发，因此，除了开发工具的选择之外，操作系统也必须是Windows 8及以上版本方能进行演练。至于范例程序代码，您可以在http://www.tdpress.com/zyzx/tsscflwj/取得，由于本书是以HTML5及JavaScript为主轴技术的开发实战，相对地，在Windows Store App的开发上，我们也采用相同的技术来进行讲解，因此不会涉及XMAL及C#、VB等其他程序语言的内容。
本书是针对HTML5、CSS3、JavaScript，以及使用前述三大技术来开发Windows Store App，共四个方向为出发点所编写，随着浏览器支持度越来越高，对于大部分的前端网页开发人员来说，HTML5应该是近期相当受到注目的一个课题。此外，原先在传统窗口界面的应用程序开发领域里，前端网页开发人员几乎无法以自身已熟知的技术能力参与其中。然而，随着Windows Store App的出现，这个限制已被打破，HTML5、CSS3及JavaScript可以被用来开发Windows Store App，因此，前端网页开发人员得以跨越以往的藩篱，进入窗口界面应用程序的开发领域中，这无疑是为前端网页开发人员打开了更广阔的航道。
本书章节在内容安排上，将会先由HTML谈起，接着介绍CSS3、HTML5及JavaScript，最后再以Windows Store App实例作为本书的结束，期望带领读者们从基础入门开始学起，最后再配合实务开发，让您具有一个完整的学习体验之旅。
Chapter 1 HTML的基础
运行在浏览器上的网页是由HTML所构成，HTML可以说是网页的骨架，开发人员创建的网页必须要使用HTML的标签，才能在浏览器上呈现给用户使用。本章将介绍HTML的创建与运行，并对于开发网页时会接触到的主要标签、API引用、对象节点、HTML与Web关系进行说明。
Chapter 2 CSS的基础
如果说HTML是网页的骨架，那么CSS就可以说是网页的皮肤，开发人员创建的网页必须要通过CSS的装饰才能吸引用户的目光。本章将介绍样式的组成与套用，并针对开发时最常使用的选择器、盒子模型、定位模式进行说明，也会在最后一个小节介绍各种排版布局的基础模板。
Chapter 3 DOM──文件对象模型
HTML与CSS构成了网页的骨架与皮肤，而DOM则是用来提供开发人员通过程序代码更改HTML与CSS的工具。本章将介绍DOM模型的概念与使用，并对于开发时最常使用的节点选择、节点操作、节点事件进行说明。
Chapter 4 全新HTML5基础HTML是一个不断在升级的标签语言，目前正在从HTML4往HTML5的方向升级。本章将介绍HTML5的概念，并对HTML5所提供的影像描绘、影音播放、数据存储、数据传输等实用又有趣的新功能进行说明。
Chapter 5 必知的JavaScript语言
JavaScript是种介于面向过程、面向对象之间的程序语言，是一种简单、好用、十分灵活的开发工具。本章将介绍JavaScript的各种语言特性，并对于JavaScript如何实现面向对象中的封装、继承、多态等概念进行说明，也会在最后一个小节介绍如何在JavaScript上实现软件架构的设计。
Chapter 6 Windows Store App 开发概念
Windows Store App在Windows 8平台是一种新形态的应用程序。本章将介绍何谓Windows Store App，以及开发Windows Store App所应事先准备的环境和工具，并针对现行开发工具Visual Studio 2013所内置的项目模板架构逐一说明，接着介绍关于Windows Store App的应用程序生命周期及应用协议，为实际开发打下基础。
Chapter 7 使用JavaScript和HTML5实作Windows Store App
本章将介绍以HTML5＋JavaScript开发Windows Store App两大主轴核心Windows Runtime Library及Windows Library for JavaScript，并介绍如何使用WinJS控件，最后会以实际开发范例，由开发到正式送审上架做一个完整的示范说明。
范例程序与工具说明
本书在编写范例程序代码时，所采用的开发工具是Visual Studio 2013，若您是由微软官方网站下载免费开发版本，要注意必须选择Express forWindows 版本。另外，要特别提醒您，本书第6章及第7章的部分，由于是在介绍Windows Store App的开发，因此，除了开发工具的选择之外，操作系统也必须是Windows 8及以上版本方能进行演练。至于范例程序代码，您可以在http://www.tdpress.com/zyzx/tsscflwj/取得，由于本书是以HTML5及JavaScript为主轴技术的开发实战，相对地，在Windows Store App的开发上，我们也采用相同的技术来进行讲解，因此不会涉及XMAL及C#、VB等其他程序语言的内容。