zoukankan      html  css  js  c++  java
  • 如何让浏览器支持HTML5标签

      在前端领域html5技术越来越流行了,可是还有一些浏览器不支持html5结构标签,这就让开发者非常蛋疼了。不过这也是没有办法的是,毕竟那些浏览器出生的时候要么还没有html5这回事、要么就是爹妈不愿意教他们怎么玩。今天就总结一下如何让浏览器支持html5结构标签(主要是前辈们的方法)借来一用:

    一、使用Coding JavaScript 方法,不支持html5标签这种事一般都是IE8及其以下版本干的事,so:

    <!--[if lt IE9]> 
    <script> 
       (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(', ');
         var i= e.length;
         while (i--){
             document.createElement(e[i])
         } 
    })() 
    </script>
    <![endif]-->

      或者是这种(《html5与css3权威指南》上也是使用的这种方法):

    <!--[if IE]> 
    <script> 
    document.createElement("header"); 
    document.createElement("footer"); 
    document.createElement("nav"); 
    document.createElement("article"); 
    document.createElement("section"); 
    </script> 
    <![endif]--> 

    二、使用Google提供的html5的shiv包( 据说是推荐方法):

    <!--[if lt IE9]> 
    <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
    <![endif]-->

    有人说这个shiv包跪了,我测试的时候还是活的,用的时候可以试一下。

    以上方法都要用CSS把结构标签转换为block:

    article,aside,dialog,footer,header,section,footer,nav,figure,menu{
      display:block;
    }

    而且为了防止用户 禁用脚本,使页面出现空白要引导用户打开脚本:

    <!--[if lte IE 8]> 
    <noscript>
         <style>.html5-wrappers{display:none!important;}</style>
         <div class="ie-noscript-warning">您的浏览器禁用了脚本,请<a href="">查看这里</a>来启用脚本!或者<a href="/?noscript=1">继续访问</a>.
         </div>
    </noscript>
    <![endif]-->
  • 相关阅读:
    最长公共子序列-动态规划
    归并排序
    最大子段和-3种方法
    kafka compaction 分析(基于kafka 0.10.2版本)
    [转载]interp1
    [转]mat2gray函数原理分析
    Java 位运算(移位、位与、或、异或、非)与逻辑运算
    ML01a
    [第1集] 机器学习的动机与应用
    tap4fun公司面试总结
  • 原文地址:https://www.cnblogs.com/kiscall/p/4696536.html
Copyright © 2011-2022 走看看