html5新特性
这一篇博文不会告诉你怎么去使用html5的新特性，只会给你总结一下新特性------对于好学的人可以把这篇文章当做一个目录
对于初接触的人来说是一个导向
对于已经接触过的人来说是一个检测你掌握程度的检测
html5新特性综述：
1、用于绘画的canvas和SVG，
canvas和SVG都允许在浏览器中创建图片，但是他们的实现原理是不同的。
SVG通过xml完成2d图形的绘制；----------反正我不用
canvas是通过JavaScript完成2d图形；---------我也不常手写他最多也就写 柱状图 饼状图 折线图 会了这些也就差不多了。
我在工作中主要使用canvas做数据的展示。我认为百度的echarts（这是链接）是一个很好用的插件，如果你不做专业性研究的话echarts够用了。如果你想做canvas游戏 ，算法的干活！
2、拖放效果
鼠标按住左键不松手移动到另一个位置，功能是不是吊炸天。详解...(有想学习的可以给我留言我再做详细的讲解，暂时没做)
3、 Geolocation 可以获取用户当前的位置信息
关于这个API 官网上是这么说的：鉴于该特性可能侵犯用户的隐私，除非用户同意，否则用户位置信息是不可用的。也就是说暂时没有卵用、
4、web存储：localstorage 和 sessionStorage这是两个客户端存储方法，用于解决cookie的存储空间小、浪费带宽问题的
localStorage:没有时间限制的数据存储
sessionStorage：针对一个session的数据存储
<script type="text/javascript">
localStorage.newString="Smith"; //存
document.write(localStorage.newString); //取
delete localStorage.newString //删除
document.write(localStorage.newString); //然后就取不到啦
// 就把localStorage和sessionStorage当做对象来操作就好了
</script>
注：对于不同的网站会存储到不同的区域，所以不用担心其他网站会访问到这个网站存储的数据
5、video和audio视频API和音频
<audio> 标签的属性
| 属性 | 值 | 描述 |
|---|---|---|
| autoplay | autoplay | 如果出现该属性，则音频在就绪后马上播放。 |
| controls | controls | 如果出现该属性，则向用户显示控件，比如播放按钮。 |
| loop | loop | 如果出现该属性，则每当音频结束时重新开始播放。 |
| preload | preload |
如果出现该属性，则音频在页面加载时进行加载，并预备播放。 如果使用 "autoplay"，则忽略该属性。 |
| src | url | 要播放的音频的 URL。 |
HTML5 <video> - 方法、属性以及事件
| 方法 | 属性 | 事件 |
|---|---|---|
| play() | currentSrc | play |
| pause() | currentTime | pause |
| load() | videoWidth | progress |
| canPlayType | videoHeight | error |
| duration | timeupdate | |
| ended | ended | |
| error | abort | |
| paused | empty | |
| muted | emptied | |
| seeking | waiting | |
| volume | loadedmetadata | |
| height | ||
| width |
6、web worker 是运行在后台的 JavaScript 如果你只学前端 用处不大 这个东西支持创建新的线程，但是不能操作DOM
7、应用程序缓存
在文档的 <html> 标签中添加 manifest 属性即可
<html manifest="demo.appcache"> <body>可以离线缓存这部分内容</body> </html>
8、一大帮html5的标签
我只说几个我常用的
| header | 页面头部，不同与<head></head> |
| aside | 页面内容之外的内容 |
| nav | 外部链接集合导航么 |
| section | 定义section |
| article | 文章、摘要或留言等形式的记录（一般搭配内嵌头部、尾部、底部结构使用） |
| hggroup | 子标题，标题信息、可选标题、TAG标签这样的数据，还是英文更好理解一些，heading of a section |
| address | 联系信息 |
| footer | 页脚 |
其他的很多感觉这些不够用的查官方文档
9、webscorket 实现与服务器双向推送相当于及时聊天 不用像以前那样使用定时器setInterval定时发送ajax请求了 ，棒棒哒，不过只兼容IE10+
10、表单
输入表单的新属性<input type=‘一下这些玩意’>
- url
- number
- range
- Date pickers (date, month, week, time, datetime, datetime-local)
- search
- color
不用说了吧 但是IE貌似还没有支持的 移动设备几乎都支持 嘻嘻 这些输入表单的新属性都有默认的验证和提醒方式 ，
新属性用来规定对数字类型的限定：
| 属性 | 值 | 描述 |
|---|---|---|
| max | number | 规定允许的最大值 |
| min | number | 规定允许的最小值 |
| step | number | 规定合法的数字间隔（如果 step="3"，则合法的数是 -3,0,3,6 等） |
| value | number | 规定默认值 |
Date也有很多 比如
- date - 选取日、月、年
- month - 选取月、年
- week - 选取周和年
- time - 选取时间（小时和分钟）
- datetime - 选取时间、日、月、年（UTC 时间）
- datetime-local - 选取时间、日、月、年（本地时间）
11、还有就是一些表单的新属性 表单的新标签 有兴趣的研究一下 （反正其他的我没遇到）
html5新特性的更多相关文章
- 转: HTML5新特性之Mutation Observer
转: HTML5新特性之Mutation Observer Mutation Observer是什么 Mutation Observer(变动观察器)是监视DOM变动的接口.当DOM对象树发生任何变动 ...
- HTML5新特性之CSS+HTML5实例
1.新的DOCTYPE和字符集 HTML5的一项准则就是化繁为简,Web页面的DOCTYPE被极大的简化. <!DOCTYPE html> 同时字符集声明也被简化了: <meta c ...
- HTML5新特性：FileReader 和 FormData
连接在这里: HTML5新特性:FileReader 和 FormData
- web全栈架构师[笔记] — 03 html5新特性
HTML5新特性 一.geolocation PC端 精度比较低 通过IP库定位 移动端 通过GPS window.navigator.geolocation 单次 getCurrentPositio ...
- HTML5新特性：范围样式
原文出处:http://blog.csdn.net/hfahe/article/details/7381141 Chromium 最近实现了一个HTML5的新特性:范围样式,又叫做< ...
- html5新特性与用法大全了解一下
有好多小伙伴私聊我问我html5新特性 和用法,下面我给大家具体介绍一下html5都新加了哪些新特性,下面我给大家总结一下. 1)新的语义标签 footer header 等等2)增强型表单 表单2. ...
- html5新特性contenteditable 属性更容易实现动态表单
介绍html5新特性的一个属性:contenteditable 作用域全局.所有的块标签都可以,例如:span.p.div.td等标签.但是,不可以作用域<br/>类型的标签. conte ...
- HTML5新特性之文件和二进制数据的操作 Blob对象
HTML5新特性之文件和二进制数据的操作 1.Blob对象 2.FileList对象 3.File对象 4.FileReader 对象 5.URL对象
- 第二季第八天 HTML5新特性
在函数内部window.a = a 在全局中就可以拿到这个变量 变量命名.作为函数的参数的时候要详细.调用的时候可以简单点 做全局变量的两个方案 1.绑在标签上data 2.闭包 视频一般都是二进 ...
随机推荐
- Scrum Meeting ——总结
冲刺总结 0*.燃尽图 迟来的燃尽图,别看它是最后一天掉了一堆,感觉很假,像是人为的把issues都关闭掉.其实不然,很多功能是大家平时做好,但是没整合在一起,所以没燃掉,在最后几天的整合中,通过测试 ...
- jenkins自动化构建iOS应用配置过程中遇到的问题
最近配置jenkins来自动构建iOS应用,期间遇上不少问题.在这里分享给大家,也给自己留个底,方便下次解决问题. 首先说明下基本情况,我们因为部署jenkins的机器不是Mac,所以不能安装Xcod ...
- linux常用命令-用户管理命令
useradd 用户名 passwd 用户名:修改该用户的密码 groupadd 组名 who: 查看现在登录了几个用户,得到的信息含义如下 登录用户名 登录终端 登录时间 登录终端的IP地址(如果没 ...
- Windows7 + Ubuntu双系统安装过程记录
本文为在已安装Windows7系统的前提下安装Ubuntu Kylin 14.10系统的过程以及期间出现的各种问题的记录. Ubuntu系统下载 Ubuntu Kylin中文官方网站:http://w ...
- Lua手动编译姿势
LUA-5.3.3.tar.gz Lua源码+链接2016年5月30日更新 手动编译姿势: 已经装有VS2010 使用VS自带的 cl.exe以及 VS命令簿 打开文件地址 运行自己的bat文件 my ...
- python写计算器
#!/usr/bin/env python # -*- coding:utf-8 -*- import re def chu(arg1): #定义加减 arg = arg1[0] #beacuse p ...
- at 常用命令
以debian 6.0.1 为例: 服务开启关闭: Usage: /etc/init.d/atd {start|stop|restart|force-reload|status} 设置一次计划任务(a ...
- Cannot find `aapt.exe`. Please install the Android SDK Build-tools package
Google has updated their SDK tools ("Android SDK Tools" Rev. 23) in a way that also requir ...
- .NET LINQ 联接运算
联接运算 将两个数据源“联接”就是将一个数据源中的对象与另一个数据源中共享某个通用特性的对象关联起来. 当查询所面向的数据源相互之间具有无法直接领会的关系时,联接就成为一项重要的运 ...
- 【XLL 框架库函数】 TempMissing/TempMissing12
创建一个xltypeMissing 类型的 XLOPER/XLOPER12 原型 LPXLOPER TempMissing(void); LPXLOPER12 TempMissing12(void); ...