如何在 IE 中使用 HTML5 元素 _ PlanABC – 怿飞’s Blog

2009-6-13 下午 - HTML/CSS/XML/XSL - HTML5 - IE

Sjoerd Visscher 发现了一个简洁的方法让样式在 IE 中作用到未知的元素上——仅需 JS 创建此未知元素即可：

document.createElement(elementName)

同理（对于 IE 来说 HTML5 元素即是未知元素），该方法也可顺延到 HTML5 的元素上（详细见：John Resig 写的《HTML5 Shiv》一文）：

<html>
<head>
<style>section { color: red; }</style>
<script>document.createElement("section")</script>
</head>
<body>
<section>Hello World!</section>
</body>
</html>

在 IE 中，为了更方便使用 HTML5 元素，我们可以引入这样的脚本：

(function(){
    // from: http://dean.edwards.name/weblog/2007/03/sniff/
    if(!/*@cc_on!@*/0) return; 

    var html5 = "abbr,article,aside,audio,bb,canvas,datagrid,datalist,details,dialog,eventsource,figure,footer,hgroup,header,mark,menu,meter,nav,output,progress,section,time,video".split(',');
    for(var i = 0, len = html5.length; i < len; i++ ) {
        document.createElement(html5[i]);
    }
})();

详细具体应用的案例如下：

这篇文章发表2009年6月13日下午 14:47，并被分类于HTML/CSS/XML/XSL，已被 3164 人阅读。您可以通过订阅 RSS 2.0 跟踪对这篇文章的评论，也可以发表您的评论，或者在您自己的网站中引用（trackback）该篇日志。

共有23 条评论

1. vapour 2009年6月13日下午 5:27 ₪
学习了。很独特的构思，为什么我想不到呢。
2. RainoXu 2009年6月13日下午 6:59 ₪
HTML5路漫漫，我们只能静静地等待它吧。。。
3. 爱月 2009年6月13日下午 7:59 ₪
一下子接受不了，慢慢看吧。。。
4. 笨乌不飞 2009年6月13日下午 7:59 ₪
HTML 5 在成为正式标准之前最好不用。
5. Betty 2009年6月13日下午 8:15 ₪
这样只是使元素能够呈现css样式吧，不能使那些元素真正的发挥作用…
6. 天堂左我往右 2009年6月14日上午 11:31 ₪
重量级的html5元素都没得用…
7. max 2009年6月14日上午 11:43 ₪
这个方法Apple.com早就用上了！
8. 布里斯班 2009年6月14日下午 12:58 ₪
ie6能用么
9. 怿飞 2009年6月15日上午 9:31 ₪
@布里斯班 IE6可以用的，测试一下就知道了，呵呵
10. cc 2009年6月15日下午 5:19 ₪
好像现在还没什么用
不过思路挺好
11. chris.jie 2009年6月16日下午 4:44 ₪
不知道怿飞看到过ie下用canvas 这个元素没?

有个日本人开发了JS 专门可以让IE支持这个元素很酷的

你可以去查查
12. 小林子里 2009年6月23日上午 2:55 ₪
你们大家难道都没有发现上面提供的脚本有个低级的错误!?没发现多了个符号么?…
13. Insen 2009年6月26日下午 10:45 ₪
@小林子里 for少了一个左括号…你眼真细呢！
14. 網站製作學習誌 » [Web] 連結分享 2009年7月3日上午 10:25 ₪
[...] 如何在 IE 中使用 HTML5 元素 [...]
15. 非常完美 2009年7月4日下午 8:26 ₪
现在很少用IE了…
16. 普通话 2009年7月14日上午 11:39 ₪
不知道IE最终的命运会是怎样
17. 游戏攻略 2009年7月17日下午 2:20 ₪
同意4楼的观点，新技术没有成型前最好别用，当然尝鲜的除外·
18. fisher 2009年7月22日下午 1:13 ₪
默然回首，才发现，已经有html5了？
19. ONEBOYS 2009年8月6日上午 11:35 ₪
我有一种使用html5的冲动了，
可以用来增加使用那些结构性元素——语义化，省下很多div。
20. 华晨 2009年8月15日下午 12:01 ₪
还在使用xhtml2，等html5普及了再用吧
21. 向html5进军，呵呵 - 小V的天空－网站建设－网页设计－seo-模板下载 2009年8月16日下午 6:21 ₪
[...] 如何在 IE 中使用 HTML5 元素 http://www.planabc.net/2009/06/13/how_to_use_html5_elements_in_ie/ Preparing for HTML5 with Semantic Class [...]
22. Insion 2009年9月25日下午 3:17 ₪
用html 5可以躲避xml parsing error，是个好东西~回去就把我的wp进化到html 5！
23. 优质商城 2009年11月3日下午 5:25 ₪
html 5对FLASH有威胁了，什么时候浏览器都支持呢。

发表评论

导航