HTML5的新特性

Posted phlsheji

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了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

以上是关于HTML5的新特性的主要内容，如果未能解决你的问题，请参考以下文章

三十八HTML5的新特性

HTML5的新特性（面试必备）

html5都有哪些新特性

HTML5有哪些新特性呢？

HTML5有哪些新特性呢？

HTML5的新特性及技巧分享总结