HTML5 现在已经不是SGML的子集,主要是关于图像,位置,存储,多任务等功能的增加。
① 新特性:
1)绘画<canvas>。
有关canvas的介绍请见:http://blog.csdn.net/zhouziyu2011/article/details/65682406和http://blog.csdn.net/zhouziyu2011/article/details/66474969
2)用于媒介回放的<video>和<audio>。
有关video和audio的介绍请见:http://blog.csdn.net/zhouziyu2011/article/details/69084961
3)Web Storage的本地存储<localStorage>和会话存储<sessionStorage>。
有关localStorage和sessionStorage的介绍请见:http://blog.csdn.net/zhouziyu2011/article/details/58591829
4)语意化更好的内容元素,比如<article> <aside> <footer> <header> <nav> <section> <hgroup>。
5)表单控件<calendar> <date> <time> <email> <url> <search>。
6)新的技术<webworker> <websocket> <Geolocation>。
有关websocket的介绍请见:http://blog.csdn.net/zhouziyu2011/article/details/60871264
② 移除的元素:
1)纯表现的元素:<basefont> <big> <center> <font> <s> <strike> <tt> <u>。
2)对可用性产生负面影响的元素:<frame> <frameset> <noframes>。
③ 处理HTML5新标签的浏览器兼容问题:
当在页面中使用HTML5新标签时,可能会得到三种不同的结果:
1)结果1:新标签被当作错误处理并被忽略,在DOM构建时会当作这个标签不存在。
2)结果2:新标签被当作错误处理,并在DOM构建时,这个新标签会被构造成行内元素。
3)结果3:新标签被识别为HTML5标签,然后用DOM节点对其进行替换。
不能识别HTML5新标签而不能使用,解决办法有两种:
1)方法1:实现标签被识别
通过document.createElement(tagName)方法即可让浏览器识别新标签,浏览器支持新标签后,还可以为新标签添加CSS样式。
2)方法2:JavaScript解决方案
a)使用html5shim:
在<head>中调用以下代码:
<!--[if lt IE 9]>
<script> src="http://html5shim.googlecode.com/svn/trunk/html5.js"</script>
<![endif]-->
当然也可以直接把这个文件下载到自己的网站上,但这个文件必须在head标签中调用。
b)使用kill IE6
在</body>之前调用以下代码:
<!--if lte IE 6]>
<script src="http://letskillie6.googlecode.com/svn/trunk/letskillie6.zh_CN.pack.js"></script>
<![endif]-->
④ 区分HTML和HTML5:
1)DOCTYPE声明
2)新增的元素