html5标签兼容ie6，7，8

注册博客园已经三年了，这三年一直在忙，没时间写博文。也许是忙，也许是懒吧！当然这三年发生了很多事，我也从开发人员转变为前端人员。

是时候对所学的，所用的知识做一下沉淀了。就从这一篇开始吧！

html5标签兼容ie6，ie7，ie8

先来看下面的代码：

 1 <html>
 2 <head>
 3     <title>study canvas</title>
 4     <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
 5     <script src="http://a.tbcdn.cn/s/kissy/1.3.0/kissy-min.js"></script>
 6     <!--[if lte IE 8]>
 7     <script type="text/javascript">
 8         (function(){
 9             var html5elmeents = "address|article|aside|audio|canvas|command|datalist|details|dialog|figure|figcaption|footer|header|hgroup|keygen|mark|meter|menu|nav|progress|ruby|section|time|video".split('|');
10             for(var i = 0; i < html5elmeents.length; i++){
11                 document.createElement(html5elmeents[i]);
12             }
13         })();
14     </script>
15     <![endif]-->
16 
17     <style type="text/css">
18 
19       .box .art{
20           width:300px;
21           height: 200px;
22           background: #cd5c5c;
23       }
24       /*
25       .box article{
26           width:300px;
27           height: 200px;
28           background:green;
29       }
30       */
31     .summary{
32         background: #ddd;
33         margin-top: 20px;
34         padding: 20px;
35     }
36     </style>
37 </head>
38 <body>
39 <div id="box" class="box">
40     <article class="art">
41     文章主体
42     </article>
43     <section class="section">
44         边栏
45     </section>
46 
47 </div>
48 <div class="summary">
49     总结：
50     html5的标签，在ie6,ie7,ie8下：
51     1.使用样式不起作用，无论是article,还是.article<br/>
52     2.使用原生的js也不起作用<br/>
53     3.加入上面的一段js，样式和原生js都可用<br/>
54 
55     ps:用kissy时可以用，可能是kissy做了兼容处理<br/>
56 </div>
57 
58 <script type="text/javascript">
59    var box = document.getElementById('box');
60    var art = box.getElementsByTagName('article')[0];
61    art.innerHTML = 'i love you';
62 
63 (function(S){
64     var sect = S.all('#box').all('section');
65     sect.html('最好');
66 
67 })(KISSY);
68 </script>
69 </body>
70 </html>

 

总结：
html5的标签，在ie6,ie7,ie8下：
1.使用样式不起作用，无论是article,还是.article

2.使用原生的js也不起作用

3.加入上面的一段js，样式和原生js都可用

ps:用kissy时可以用，可能是kissy做了兼容处理

 

posted @ 2013-12-09 14:25  sx_summer  阅读(469)  评论(0)  编辑  收藏  举报