让IE6简单兼容HTML5

最新推荐文章于 2021-07-25 13:48:23 发布

二子戴代

最新推荐文章于 2021-07-25 13:48:23 发布

阅读量310

点赞数

分类专栏： HTML5

HTML5 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

现在越来越多的wordpress主题采用HTML5+CSS3设计，已经不再支持IE6了，但是windowXP的用户在国内依然很多，因为XP默认就是安装IE6，这是令人头疼的问题。

如何让你的站点简单的支持IE6呢？其实也很简单，让IE（包括IE6）支持HTML5元素，我们需要在HTML头部添加以下JavaScript，这是一个简单的document_createElement_x声明，利用条件注释针对IE来调用这个js文件。Opera，FireFox等其他非IE浏览器就会忽视这段代码，也不会存在http请求。

操作方法：复制如下代码，放在<head>和</head>标签里面。这里的代码已经包含一整套的浏览器判断了

<script>
(function (a, b) {
function h(a, b) {
var c = a.createElement_x("p"),
d = a.getElementsByTagName_r("head")[0] || a.documentElement;
return c.innerHTML = "x<style>" + b + "</style>",
d.insertBefore(c.lastChild, d.firstChild)
}
function i() {
var a = l.elements;
returntypeof a == "string" ? a.split(" ") : a
}
function j(a) {
var b = {},
c = a.createElement_x,
f = a.createDocumentFragment,
g = f();
a.createElement_x = function (a) {
if (!l.shivMethods)
return c(a);
var f;
return b[a] ? f = b[a].cloneNode() : e.test(a) ? f = (b[a] = c(a)).cloneNode() : f = c(a),
f.canHaveChildren && !d.test(a) ? g.a(f) : f
},
a.createDocumentFragment = Function("h,f", "return function(){var n=f.cloneNode(),c=n.createElement_x;h.shivMethods&&(" + i().join().replace(/\w+/g, function (a) {
return c(a),
g.createElement_x(a),
'c("' + a + '")'
}) + ");return n}")(l, g)
}
function k(a) {
var b;
return a.documentShived ? a : (l.shivCSS && !f && (b = !!h(a, "article,aside,details,figcaption,figure,footer,header,hgroup,nav,section{display:block}audio{display:none}canvas,video{display:inline-block;*display:inline;*zoom:1}[hidden]{display:none}audio[controls]{display:inline-block;*display:inline;*zoom:1}mark{background:#FF0;color:#000}")), g || (b = !j(a)), b && (a.documentShived = b), a)
}
var c = a.html5 || {},
d = /^<|^(?:button|form|map|select|textarea|object|iframe|option|optgroup)$/i,
e = /^<|^(?:a|b|button|code|div|fieldset|form|h1|h2|h3|h4|h5|h6|i|iframe|img|input|label|li|link|ol|option|p|param|q|script|select|span|strong|style|table|tbody|td|textarea|tfoot|th|thead|tr|ul)$/i,
f,
g;
(function () {
var c = b.createElement_x("a");
c.innerHTML = "<xyz></xyz>",
f = "hidden"in c,
f && typeof injectElementWithStyles == "function" && injectElementWithStyles("#modernizr{}", function (b) {
b.hidden = !0,
f = (a.getComputedStyle ? getComputedStyle(b, null) : b.currentStyle).display == "none"
}),
g = c.childNodes.length == 1 || function () {
try {
b.createElement_x("a")
} catch (a) {
return !0
}
var c = b.createDocumentFragment();
returntypeof c.cloneNode == "undefined" || typeof c.createDocumentFragment == "undefined" || typeof c.createElement_x == "undefined"
}
()
})();
var l = {
elements : c.elements || "abbr article aside audio bdi canvas data datalist details figcaption figure footer header hgroup mark meter nav output progress section summary time video",
shivCSS : c.shivCSS !== !1,
shivMethods : c.shivMethods !== !1,
type : "default",
shivDocument : k
};
a.html5 = l,
k(b)
})(this, document)
</script>

当然，这里你也可以选择使用在google托管的JS代码，达到的效果和上面的代码一样的，代码如下：

<script src=”http://html5shiv.googlecode.com/svn/trunk/html5.js”></script>

如果觉得这样会影响你的网页打开速度，你可以把html5的js文件直接下载下来让后上传到自己的服务器单独调用。

http://blog.sina.com.cn/s/blog_48dc08c90101e8ka.html

二子戴代

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
让IE6简单兼容HTML5

现在越来越多的wordpress主题采用HTML5+CSS3设计，已经不再支持IE6了，但是windowXP的用户在国内依然很多，因为XP默认就是安装IE6，这是令人头疼的问题。如何让你的站点简单的支持IE6呢？其实也很简单，让IE（包括IE6）支持HTML5元素，我们需要在HTML头部添加以下JavaScript，这是一个简单的document_createElement_x声明，利用条件注
复制链接

扫一扫