本文中所有表格以2011年4月国内最新版本的浏览器为书写标准 |
全局属性 |
属性 | Firefox4.0 | Opera11.0 | Chrome10.0 | Safari5.0 | IE9.0 |
hidden全局属性 | ○ | ○ | ○ | ○ | ○ |
contenteditable 全局属性 | ○ | ○ | ○ | ○ | ○ |
表单元素 |
元素 | Firefox4.0 | Opera11.0 | Chrome10.0 | Safari5.0 | IE9.0 |
input type=search | ○ | ○ | ○ | ○ | ╳ |
input type=tel | ○ | ○ | ○ | ○ | ╳ |
input type=url | ○ | ○ | ○ | ○ | ╳ |
input type=email | ○ | ○ | ○ | ○ | ╳ |
input type=datetime | ╳ | ○ | ○ | 不支持特殊用户界面,支持min与max属性,step属性 | ╳ |
input type=date | ╳ | ○ | ○ | 不支持特殊用户界面,支持min与max属性,step属性 | ╳ |
input type=month | ╳ | ○ | ○ | 不支持特殊用户界面,支持min与max属性,step属性 | ╳ |
input type=week | ╳ | ○ | ○ | 不支持特殊用户界面,支持min与max属性,step属性 | ╳ |
input type=time | ╳ | ○ | ○ | 不支持特殊用户界面,支持min与max属性,step属性 | ╳ |
input type=datetime-local | ╳ | ○ | ○ | 不支持特殊用户界面,支持min与max属性,step属性 | ╳ |
input type=number | 仅支持min与max属性,不支持特殊用户界面,提交时验证,step属性 | ○ | ○ | ○ | ╳ |
input type=range | 仅支持min与max属性,不支持特殊用户界面,提交时验证,step属性 | ○ | ○ | ○ | ╳ |
input type=color | ╳ | 支持特殊用户界面,不支持提交时验证 | 不支持特殊用户界面,支持提交时验证 | 不支持特殊用户界面,支持提交时验证 | ╳ |
input type=checkbox元素的indeterminate属性 | ○ | ╳ | ○ | ○ | ╳ |
Select元素的required 属性 | ○ | ╳ | ○ | ╳ | ╳ |
datalist | ○ | ○ | ╳ | 不支持datalist元素,支持其他元素的list属性 | ╳ |
output | ○ | ○ | ○ | ╳ | ╳ |
progress | ╳ | ○ | ○ | ╳ | ╳ |
meter | ╳ | ○ | ○ | ╳ | ╳ |
其他元素 |
元素 | Firefox4.0 | Opera11.0 | Chrome10.0 | Safari5.0 | IE9.0 |
新增结构元素 | ○ | ○ | ○ | ○ | ○ |
figure元素 | ○ | ○ | ○ | ╳ | ○ |
figcaption元素 | ○ | ○ | ○ | ╳ | ○ |
mark元素 | ○ | ○ | ○ | ╳ | ○ |
time元素 | ╳ | ╳ | ╳ | ╳ | ╳ |
details元素 | ╳ | ╳ | ○ | ╳ | ╳ |
summary元素 | ○ | ○ | ○ | ○ | ╳ |
command元素 | ╳ | ╳ | ╳ | ╳ | ╳ |
menu元素 | ○ | ○ | ○ | ○ | ╳ |
表单属性 |
属性 | Firefox4.0 | Opera11.0 | Chrome10.0 | Safari5.0 | IE9.0 |
提交时验证的pattern属性 | ○ | ○ | ○ | ○ | ╳ |
提交时验证的required属性 | ○ | ○ | ○ | ○ | ╳ |
form属性 | ○ | ○ | ○ | ╳ | ╳ |
formaction属性 | ○ | ○ | ○ | ╳ | ╳ |
formmethod属性 | ○ | ○ | ○ | ╳ | ╳ |
formnovalidate属性 | ○ | ○ | ○ | ○ | ╳ |
autocomplete属性 | ○ | ○ | ╳ | ╳ | ○ |
autofocus属性 | ○ | ○ | ○ | ○ | ╳ |
placeholder属性 | ○ | ○ | ○ | ○ | ╳ |
multiple属性 | ○ | ○ | ○ | ○ | ╳ |
CSS选择器 | ○ | ○ | ○ | ○ | ○ |
API |
API | Firefox4.0 | Opera11.0 | Chrome10.0 | Safari5.0 | IE9.0 |
canvas元素 | ○ | ○ | ○ | ○ | ○ |
Canvas 2D API | ○ | ○ | ○ | ○ | ○ |
Canvas 3D API(现已改为WebGL 3D API) | ○ | ○ | ○ | ╳ | ○ |
Canvas Text | ○ | ○ | ○ | ○ | ○ |
video元素 | ○ | ○ | ○ | ○ | ○ |
MPEG-4支持 | ╳ | ╳ | ╳ | ○ | ○ |
H-264支持 | ╳ | ╳ | ○ | ○ | ○ |
Ogg Theora支持 | ○ | ○ | ○ | ╳ | ╳ |
WebM支持 | ○ | ○ | ○ | ╳ | ○ |
audio元素 | ○ | ○ | ○ | ○ | ○ |
PCM audio支持 | ○ | ○ | ○ | ○ | ╳ |
MP3支持 | ╳ | ╳ | ○ | ○ | ○ |
AAC支持 | ╳ | ╳ | ○ | ○ | ○ |
Ogg Vorbis支持 | ○ | ○ | ○ | ╳ | ╳ |
WebM支持 | ○ | ○ | ○ | ╳ | ○ |
拖放API | ○ | ╳ | ○ | ○ | ○ |
Geolocation API | ○ | ○ | ○ | ○ | ○ |
跨域通信 | ○ | ○ | ○ | ○ | ○ |
WebSocket | ○ 但在最新版浏览器中因为在协议上存在基础安全隐患,所以被禁用,一旦协议被更新,将恢复使用 | ○ 但在最新版浏览器中因为在协议上存在基础安全隐患,所以被禁用,一旦协议被更新,将恢复使用 | ○ | ○ | ╳ |
文件API之FileReader API | ○ | ○ | ○ | ╳ | ╳ |
文件API之FileWriter API | ╳ | ╳ | ╳ | ╳ | ╳ |
Session Storage | ○ | ○ | ○ | ○ | ○ |
Local Storage | ○ | ○ | ○ | ○ | ○ |
Web SQL Database | ╳ | ○ | ○ | ○ | ╳ |
Web Workers | ○ | ○ | ○ | ○ | ╳ |
12月30日消息,据国外媒体报道,2010年随着HTML 5的迅猛发展并牢牢占据了Web开发的核心位置,各大公司如Google、微软、苹果、Mozilla和Opera的浏览器开发业务在这一年都异常繁忙。
在浏览器开发者的记忆中,2010年无疑是颇为繁忙的一年,无论是Mozilla火狐、Google Chrome、苹果Safari,还是微软Internet Explorer和Opera都不断推陈出新。
目前浏览器开发技术的核心无疑就是HTML5标准,它既是HTML标准近10年来的一次变革性的更新,也进一步巩固了现代网络浏览器的HTML标准。在其影响下,网络用户可以拥有更为丰富的媒体体验,享受海量的视频和影音资源。很多开发者甚至将HTML 5视为Adobe Flash的替代品,因为苹果的iOS还不允许在移动设备上收看Flash。
Mozilla
2010年Mozilla主要在1月份发布了Firefox(火狐)3.6,提供了支持HTML 5和改进的JavaScript的性能。在Firefox 3.6中,Mozilla整合了插件检测功能以确保用户浏览器的扩展功能随时保持更新,同时更新了浏览器标签显示,新的标签可以同时在当前页面旁边打开。
Firefox 3.6的发布打开了Mozilla发展的新时代,2010年一年Mozilla的开发者们一直在研究如何在不进行大幅度更新的情况下加快对浏览器的创新设计。而Firefox 3.6 洛仑兹计划虽然没有达到预期,也为Mozilla在这方面的创新做出了新的尝试。
随着Firefox 3.6.4的推出,洛仑兹计划迈出了第一步,Mozilla的开发者们提出了进程外插件技术来改进浏览器的稳定性和安全性。之后从Firefox 3.6.4更新至3.6.13,Mozilla都没有为浏览器增添新的属性。虽然洛仑兹计划的初衷是介绍Firefox3.6新增的性能,但是貌似它最终也只是解决了产品的安全性和漏洞问题。
除了推广洛仑兹计划之外,Mozilla在2010年的浏览器开发项目就主要集中在Firefox 4上了。Mozilla在2010年5月公开讨论了关于Firefox 4的计划,但言明要在2011年初正式发布。7月份推出了Firefox 4测试版,同时介绍了其专门保护网络用户设计的安全性能,以及使用了新的JagerMonkey JavaScript后的高速性。
Firefox 4中的标签使用效率也得到了提升,Mozilla将其命名为Tab Candy,可以方便用户分组使用和管理标签。
Google Chrome
与Mozilla将重心放在Firefox上不同,Google在2010年推出了5款以上的Chrome浏览器,平均每12周就推出一款,发行速度无疑是相当快的。
2010年1月底,Google推出了年内第一款稳定的Chrome浏览器 Chrome 4,同时为该浏览器推出了一款拓展型的附加系统。
5月底,Google再次推出了Chrome 5,这也是该公司浏览器开发中的一次里程碑。Chrome 5 是Google第一次面向Linux和苹果Mac操作系统推出一款稳定的浏览器,而在此之前,Google的浏览器主要是面向Windows系统用户的。Chrome 5同时还对整合后的浏览器同步性能加以改良,支持浏览器开启和主题设置。
6月,Google推出了更新后的Chrome 5.0.375.86,整合了Adobe Flash播放功能。9月,Google再次推出了Chrome 6,主要是在安全性上进行了更新,增加了9个补丁。之后10月份,推出了同样用于安全性更新的Chrome 7。12月初推出了Chrome 8,对800个漏洞进行了修补,并整合了Adobe PDF阅读程序。目前Chrome浏览器是Google Chrome OS的核心,而后者预计将在2011推出。
苹果 Safari
2010年,苹果发布浏览器的速度貌似比Google要慢。仅仅是紧跟改进HTML 5特性的潮流,苹果主要在6月发布了一款Safari 5浏览器,对其使用效率和性能加以改良。而在Safari 4中首次亮相的Nitro JavaScript引擎这次也得到了进一步改良,增加了DNS预取功能。苹果同时还在年内推出了Safari开发者计划,为Safari提供扩展的开发程序。
微软Internet Explorer
微软可算是这些主要的浏览器公司中唯一一个没有对产品进行大幅度更新的了。虽然年内IE在安全性和稳定性方面进行了多次更新,但是没有发布新版本的IE。 另外,微软在2010年也没有就其即将推出的IE 9浏览器多谈,目前产品还在开发过程中,最早的测试版是今年9月推出的。
微软凭借着IE 9也跳上了HTML 5的列车,为用户提供了新的界面,同时也提供了更快的Chakra JavaScript引擎。但是目前IE 9只适用于Windows 7用户,预计到2011年会适用于其他Windows系统。
Opera
挪威浏览器开发商Opera软件2010年推出了Opera 11,重点引进了标签堆叠属性便于用户管理标签。这也标志着Opera的一次正式的功能拓展。
HTML5能为我们做的事儿很多,最为可口的就是语义化标签的应用,如果你已经在Chrome或者其他支持HTML5的浏览器上用过它的牛x,那这篇文章对你一定有用,因为现在你也可以在IE上用到HTML5。
好吧!大前端今天的主题是:HTML5 Shiv
下面是引用Google的html5.js文件,好处就不说了:
<!--[if IE]>
<script src=”http://html5shiv.googlecode.com/svn/trunk/html5.js”></script>
< ![endif]-->
将上代码复制到head部分,记住一定要是head部分(因为IE必须在元素解析前知道这个元素,所以这个js文件不能在其他位置调用,否则失效)
当然,你也可以把代码拿出来自己看着办:
(function(){if(!/*@cc_on!@*/0)return;var e ="abbr,article,aside,audio,canvas,datalist,details,dialog,eventsource,figure,footer,header,hgroup,mark,menu,meter,nav,output,progress,section,time,video".split(','),i=e.length;while(i--){document.createElement(e[i])}})()
最后在css里面加上这段:
/*html5*/
article,aside,dialog,footer,header,section,footer,nav,figure,menu{display:block}
主要是让这些html5标签成块状,像div那样。
好了,简单吧,一句话概括就是:引用html5.js 使html5标签成块状