7 HTML网页的API
7.1 HTML网页元素
略
7.2 Canvas
Canvas API（画布）用于在网页实时生成图像，并且可以操作图像内容，相当于一个可以用JavaScript操作的位图。
<canvas id="myCanvas" width="400" height="200">
您的浏览器不支持canvas！
</canvas>
7.3 SVG图像
SVG是“可缩放矢量图”（Scalable Vector Graphics）的缩写，是一种描述向量图形的XML格式的标记化语言。
<img src="circle.svg">
7.4 表单
略
7.5 文件与二进制数据的操作
ECMAScript 5引入了Blob对象，允许直接操作二进制数据。
File对象：负责处理那些以文件形式存在的二进制数据，也就是操作本地文件；
FileList对象：File对象的网页表单接口；
FileReader对象：负责将二进制数据读入内存内容；
URL对象：用于对二进制数据生成URL。
略
7.6 Web Worker
Web Worker的目的，就是为JavaScript创造多线程环境，允许主线程将一些任务分配给子线程。
Web Worker有以下几个特点：
同域限制。
DOM限制。子线程无法读取网页的DOM对象
脚本限制。子线程无法读取网页的全局变量和函数
文件限制。子线程无法读取本地文件
7.7 SSE：服务器发送事件（基本完成）
服务器发送事件（Server-Sent Events，简称SSE），就是浏览器向服务器发送一个HTTP请求，然后服务器不断单向地向浏览器推送“信息”。
SSE与WebSocket相似，都是用来建立浏览器与服务器之间的通信渠道。两者的区别在于：
1、WebSocket是全双工通道，可以双向通信，功能更强；SSE是单向通道，只能服务器向浏览器端发送。
2、WebSocket是一个新的协议，需要服务器端支持；SSE则是部署在HTTP协议之上的，现有的服务器软件都支持。
7.8 Page Visiblity
用于判断页面是否处于浏览器的当前窗口。
7.9 FullScreen
控制浏览器的全屏显示。
使用的时候，可以针对整个网页，也可以针对某个网页元素（比如播放视频的video元素）。
7.10 Web Speech
这个API用于浏览器接收语音输入。
7.11 requestAnimationFrame
requestAnimationFrame是浏览器用于定时循环操作的一个接口，类似于setTimeout，主要用途是按帧对网页进行重绘。
它与显示器的刷新频率保持同步。
7.12 WebSocket（基本完成）
HTML5提出了浏览器的WebSocket API。它允许服务器端与客户端进行全双工的通信。
WebSocket不使用HTTP协议，而是使用自己的协议。
7.13 WebRTC
WebRTC是“网络实时通信”（Web Real Time Communication）的缩写。它能实现两个浏览器之间直接进行视频和音频的通信，不经过服务器。
7.14 Web Components
网站往往需要一些相同的模块，比如日历、调色板等等，这种模块就被称为“组件”（component）。Web Component就是网页组件式开发的技术规范。
1、template标签表示网页中某些重复出现的部分的代码模板。它存在于DOM之中，但是在页面中不可见。
2、可以自定义网页元素，这就叫做Custom Element。它是Web component技术的核心。
3、Shadow DOM指的是，浏览器将模板、样式表、属性、JavaScript代码等，封装成一个独立的DOM元素。它可以向用户隐藏细节，直接提供组件，并且其封装内部样式表，不会影响到外部
4、HTML Import用于将外部的HTML文档加载进当前文档。我们可以将组件的HTML、CSS、JavaScript封装在一个文件里，然后插入到需要使用该组件的网页。
Web Components是非常新的技术，为了让老式浏览器也能使用，Google推出了一个函数库Polymer.js。
网友评论