资料来源：网络整理
时间：2023/2/14 0:11:40 共计：3585 浏览
不管怎么说，html5的出现使得前台设计师迎来了一个崭新的春天，它应该是未来发展的必然趋势，但html5要想实现完整的功能，必然要与css3结合起来。但我们知道的是，各大流行浏览器对css3的支持度并不是那样的完美，特别是ie浏览器，即使是ie9版本仍然只支持少量的css3代码。
这也就造成了目前国内市场中，以html5+css3来作为书写标准的网页是少之又少，即使有也仅仅使用了一些较为兼容的部分，对于很多酷炫的功能只能望
洋兴叹。想让ie能够兼容大部分的css3大部分的代码目前来说还是一件很困难的事情，因为那是微软的事情，我们无论如何努力都是枉然。
但抛却css3不谈，有什么方法可以使得ie浏览器可以兼容html5呢？其实早在很久之前，国外牛人就已经写出了html5.js的兼容代码，并将之上传到google库中方便大家直接调用。
这方法虽然不错，但也只能解决一些较为简单的不兼容情况，对于一些圆角之类的代码依然毫无改观，其原因是因为我们的这个方法仅仅修改的是浏览器不识别某些
html5标签的缘故。只要我们可以让浏览器可以识别这些新标签的话，问题就会迎刃而解了。这个html5.js的原理也正是这样，先让我们来看一下
html5.js中包含什么样的代码吧：
-
-
-
-
(function(l,f){function m(){var a=e.elements;return"string"==typeof a?a.split(" "):a}function i(a){var b=n[a[o]];b||(b={},h++,a[o]=h,n[h]=b);return b}function p(a,b,c){b||(b=f);if(g)return b.createElement(a);c||(c=i(b));b=c.cache[a]?c.cache[a].cloneNode():r.test(a)?(c.cache[a]=c.createElem(a)).cloneNode():c.createElem(a);return b.canHaveChildren&&!s.test(a)?c.frag.appendChild(b):b}function t(a,b){if(!b.cache)b.cache={},b.createElem=a.createElement,b.createFrag=a.createDocumentFragment,b.frag=b.createFrag();
-
a.createElement=function(c){return!e.shivMethods?b.createElem(c):p(c,a,b)};a.createDocumentFragment=Function("h,f","return function(){var n=f.cloneNode(),c=n.createElement;h.shivMethods&&("+m().join().replace(/[\w\-]+/g,function(a){b.createElem(a);b.frag.createElement(a);return'c("'+a+'")'})+");return n}")(e,b.frag)}function q(a){a||(a=f);var b=i(a);if(e.shivCSS&&!j&&!b.hasCSS){var c,d=a;c=d.createElement("p");d=d.getElementsByTagName("head")[0]||d.documentElement;c.innerHTML="x<style>article,aside,dialog,figcaption,figure,footer,header,hgroup,main,nav,section{display:block}mark{background:#FF0;color:#000}template{display:none}</style>";
-
c=d.insertBefore(c.lastChild,d.firstChild);b.hasCSS=!!c}g||t(a,b);return a}var k=l.html5||{},s=/^<|^(?:button|map|select|textarea|object|iframe|option|optgroup)$/i,r=/^(?:a|b|code|div|fieldset|h1|h2|h3|h4|h5|h6|i|label|li|ol|p|q|span|strong|style|table|tbody|td|th|tr|ul)$/i,j,o="_html5shiv",h=0,n={},g;(function(){try{var a=f.createElement("a");a.innerHTML="<xyz></xyz>";j="hidden"in a;var b;if(!(b=1==a.childNodes.length)){f.createElement("a");var c=f.createDocumentFragment();b="undefined"==typeof c.cloneNode||
-
"undefined"==typeof c.createDocumentFragment||"undefined"==typeof c.createElement}g=b}catch(d){g=j=!0}})();var e={elements:k.elements||"abbr article aside audio bdi canvas data datalist details dialog figcaption figure footer header hgroup main mark meter nav output progress section summary template time video",version:"3.7.0",shivCSS:!1!==k.shivCSS,supportsUnknownElements:g,shivMethods:!1!==k.shivMethods,type:"default",shivDocument:q,createElement:p,createDocumentFragment:function(a,b){a||(a=f);
-
if(g)return a.createDocumentFragment();for(var b=b||i(a),c=b.frag.cloneNode(),d=0,e=m(),h=e.length;d<h;d++)c.createElement(e[d]);return c}};l.html5=e;q(f)})(this,document);
从上面的代码中，我们可以看出，js代码帮助我们注册了诸如footer\header之类的html5专用标签，按照这个思路来分析的话，我们自己使用命名空间的办法应该也能够实现，只是因为时间的关系，针对命名空间的问题我们今天就先不讨论了。
您可以将上面的代码复制粘贴进一个已有的js文件中，或者另存为一个新的html5.js文件。
因为原作者已经将其上传至了google库，所以您完全可以在head标签内写进如下代码：
-
<!--[if IE]>
-
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
-
<![endif]-->
本方法经过测试的确对ie浏览器是有些作用的，但是对于搜狗等浏览器来说还是不会有什么改观，因此在这里呼吁：为了更好体验网络生活，还是尽量选用google的chorme浏览器吧！
版权说明：
本网站凡注明“广州京杭 原创”的皆为本站原创文章，如需转载请注明出处！
本网转载皆注明出处，遵循行业规范，如发现作品内容版权或其它问题的，请与我们联系处理！
欢迎扫描右侧微信二维码与我们联系。
免费热线：400-683-0016
扫二维码关注公众号
当前位置：