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.闭包 视频一般都是二进 ...
随机推荐
- WSDL2java简单使用
一.使用工具WSDL2java把接口转为本地可调用的.java文件 工具的目录结构: 设置WSDL2Java(URL).bat中的参数 set Axis_Lib=.\lib set Java_Cmd= ...
- Linux C 静态库(.a) 与 动态库(.so) 的详解
库从本质上来说是一种可执行代码的二进制格式,可以被载入内存中执行.库分静态库和动态库两种. 一.静态库和动态库的区别 1.静态函数库 这类库的名字一般是libxxx.a:利用静态函数库编译成的文件比较 ...
- HahsRouter hash 路由
无刷新页面,切换视图,用hash 实现路由切换,本身附带history记录,简单舒服. 最近用vue,看到vue-route的路由,做单页应用切换视图真心易如反掌,分分钟爽到不行.为了加深理解其内涵原 ...
- Segment set
题目大意: 在一个平面上,给定N根线段,若某条线段与另一条线段相交,则将它们归于同个集合,给定k,问第k条线段所在的集合中线段的数量. 题目分析: 问题主要考察计算几何和并查集. 首先我们要判断两条线 ...
- 安装第三方模块方法和requests
如何安装第三方模块 pip3 pip3 install xxxx 源码 下载,解压 进入目录 python setup.py inst ...
- JSONObject.fromObject(map)（JSON与JAVA数据的转换）
JSON与JAVA数据的转换(JSON 即 JavaScript Object Natation,它是一种轻量级的数据交换格式,非常适合于服务器与 JavaScript 的交互.) 上一篇文章中有这么 ...
- python之路六
面向对象 引言 提到面向对象,总是离不开几个重要的术语:多态(Polymorphism),继承(Inheritance)和封装(Encapsulation).Python也是一种支持OOP的动态语言, ...
- phpcms
phpcms 织梦 帝国cms
- delphi xe4 程序添加管理员权限要求后不能调试的解决方法
环境: win7 企业版 xe4 问题: 把项目设置为需要管理员权限才能运行后,调试会弹出一个提示框,如图:
- win7 去快捷箭头
去掉快捷方式箭头.reg Windows Registry Editor Version 5.00 [HKEY_LOCAL_MACHINE\SOFTWARE\Microsoft\Windows ...