HTML5的新特性
1.为 HTML5 建立的一些规则: 新特性应该基于 HTML、CSS、DOM 以及 JavaScript。 降低对外部插件的需求(比方 Flash) 更优秀的错误处理 很多其它代替脚本的标记 HTML5 应该独立于设备 开发进程应对公众透明 2.HTML5 中的一些有趣的新特性: 用于绘画的 canvas 元素 用于媒介回放的 video 和 audio 元素 对本地离线存储的更好的支持 新的特殊内容元素,比方 article、footer、header、nav、section 新的表单控件。比方 calendar、date、time、email、url、search 3.HTML5 <video> - 使用 DOM 进行控制 4.HTML5规定了一种通过audio元素来包括音频的标准方法。audio元素可以播放声音文件或者音频流。5. 拖放(Drag 和 drop): ondragstart,setData(),ondragover,ondrop 6.canvas元素用于在网页上绘制图形,拥有多种绘制路径、矩形、圆形、字符以及加入图像的方法:线条、圆形、渐变、图像 7.HTML5 支持内联 SVG。什么是SVG? SVG 指可伸缩矢量图形 (Scalable Vector Graphics) SVG 用于定义用于网络的基于矢量的图形 SVG 使用 XML 格式定义图形 SVG 图像在放大或改变尺寸的情况下其图形质量不会有损失 SVG 是万维网联盟的标准 与其它图像格式相比(比方 JPEG 和 GIF)。使用 SVG 的优势在于: SVG 图像可通过文本编辑器来创建和改动 SVG 图像可被搜索、索引、脚本化或压缩 SVG 是可伸缩的 SVG 图像可在不论什么的分辨率下被高质量地打印 SVG 可在图像质量不下降的情况下被放大 8.下表列出了 canvas 与 SVG 之间的一些不同之处。 Canvas 依赖分辨率 不支持事件处理器 弱的文本渲染能力 可以以 .png 或 .jpg 格式保存结果图像 最适合图像密集型的游戏。当中的很多对象会被频繁重绘 SVG 不依赖分辨率 支持事件处理器 最适合带有大型渲染区域的应用程序(比方谷歌地图) 复杂度高会减慢渲染速度(不论什么过度使用 DOM 的应用都不快) 不适合游戏应用 9.HTML5 提供了两种在client存储数据的新方法: localStorage - 没有时间限制的数据存储 sessionStorage - 针对一个 session 的数据存储 之前,这些都是由 cookie 完毕的。可是cookie不适合大量数据的存储,由于它们由每一个对server的请求来传递,这使得 cookie 速度非常慢并且效率也不高。
10.HTML5引入了应用程序缓存,这意味着web应用可进行缓存,并可在没有因特网连接时进行訪问。 应用程序缓存为应用带来三个优势: 离线浏览 - 用户可在应用离线时使用它们 速度 - 已缓存资源载入得更快 降低server负载 - 浏览器将仅仅从server下载更新过或更改过的资源 如需启用应用程序缓存。请在文档的<html>标签中包括manifest属性 manifest文件须要配置正确的 MIME-type,即"text/cache-manifest"。必须在 web server上进行配置 11.当在 HTML 页面中运行脚本时,页面的状态是不可响应的,直到脚本已完毕。
web worker 是执行在后台的 JavaScript,独立于其它脚本,不会影响页面的性能。您能够继续做不论什么愿意做的事情:点击、选取内容等等。而此时 web worker 在后台执行。 12.HTML5 server发送事件(server-sent event)同意网页获得来自server的更新 Server-Sent 事件 - 单向消息传递 Server-Sent 事件指的是网页自己主动获取来自server的更新。 13.HTML5 拥有多个新的表单输入类型。这些新特性提供了更好的输入控制和验证。
* email * url * number * range * Date pickers (date, month, week, time, datetime, datetime-local) * search * color 14.HTML5 的新的表单元素 datalist:元素规定输入域的选项列表 keygen:提供一种验证用户的可靠方法 output: 用于不同类型的输出,比方计算或脚本输出 15.HTML5 的新的表单属性 新的 form 属性: * autocomplete * novalidate 新的 input 属性: * autocomplete * autofocus * form * form overrides (formaction, formenctype, formmethod, formnovalidate, formtarget) * height 和 width * list * min, max 和 step * multiple * pattern (regexp) * placeholder * required