html5新特性

1.html5新特性

1.1语义化标签

使得页面的内容结构化，见名知义
 

1.2 音频audio标签

<audio>
            <audio src="someaudio.wav">
            您的浏览器不支持 audio 标签。
</audio>

1.3 视频video标签

<video>
    <video src="/i/movie.ogg" controls="controls"> 
    your browser does not support the video tag 
</video>

1.4 canvas、svg

canvas是一个可以通过脚本语言（主要指JavaScript）来绘制图形的HTML元素，

Canvas	SVG
依赖分辨率	不依赖分辨率
不支持事件处理器	支持事件处理器
弱的文本渲染能力	最适合带有大型渲染区域的应用程序。例如地图
能够以 .png或 .jpg 格式化保存结果图像	复杂度高会减慢渲染速度（任何过度使用DOM的应用都不快）
最适合图像密集型的游戏，其中的许多对象会被频繁重绘	不适合游戏应用

1.5 webStorage

Web Storage的目的是为了克服由cookie带来的一些限制，当数据需要被严格控制在客户端上时，无须持续地将数据发回服务器。

Web Storage的两个主要目标是：

• 提供一种在cookie之外存储会话数据的途径。
• 提供一种存储大量可以跨会话存在的数据的机制。

 localStorage

• 用于长久保存整个网站的数据，保存的数据没有过期时间，直到手动去除。

 sessionStorage

• 用于临时保存同一窗口(或标签页)的数据，在关闭窗口或标签页之后将会删除这些数据。

1.6 增强型表单

HTML5 拥有多个新的表单 Input 输入类型。这些新特性提供了更好的输入控制和验证。

输入类型	描述
color	主要用于选取颜色
date	从一个日期选择器选择一个日期
datetime	选择一个日期（UTC 时间）
datetime-local	选择一个日期和时间 (无时区)
email	包含 e-mail 地址的输入域
month	选择一个月份
number	数值的输入域
range	一定范围内数字值的输入域
search	用于搜索域
tel	定义输入电话号码字段
time	选择一个时间
url	URL 地址的输入域
week	选择周和年

HTML5 也新增以下表单元素

表单元素	描述
	元素规定输入域的选项列表使用 元素的 list 属性与 元素的 id 绑定
	提供一种验证用户的可靠方法标签规定用于表单的密钥对生成器字段。
	用于不同类型的输出比如计算或脚本输出

1.7 HTML5 新增的表单属性

• • placehoder 属性，简短的提示在用户输入值前会显示在输入域上。即我们常见的输入框默认提示，在用户输入后消失。
  • required 属性，是一个 boolean 属性。要求填写的输入域不能为空
  • pattern 属性，描述了一个正则表达式用于验证 元素的值。
  • min 和 max 属性，设置元素最小值与最大值。
  • step 属性，为输入域规定合法的数字间隔。
  • height 和 width 属性，用于 image 类型的 标签的图像高度和宽度。
  • autofocus 属性，是一个 boolean 属性。规定在页面加载时，域自动地获得焦点。
  • multiple 属性 ，是一个 boolean 属性。规定 元素中可选择多个值。