让IE9以下版本的浏览器兼容HTML5的方法


Posted in HTML / CSS onMarch 12, 2014

让IE(包括IE6)支持HTML5元素,我们需要在HTML头部添加以下JavaScript,这是一个简单的document.createElement声明,利用条件注释针对IE来调用这个js文件。Opera,FireFox等其他非IE浏览器就会忽视这段代码,也不会存在http请求。

复制代码
代码如下:

<!–[if IE]>
<script src=”http://html5shiv.googlecode.com/svn/trunk/html5.js”></script>
<![endif]–>

上面这段代码仅会在IE浏览器下运行,还有一点需要注意,在页面中调用html5.js文件必须添加在页面的head元素内,因为IE浏览器必须在元素解析前知道这个元素,所以这个js文件不能在页面底部调用。
这个html5的js文件是作者把他放在Google code project上提供给大家可以直接调用的,当然,如果觉得这样会影响你的网页打开速度,你可以把html5的js文件直接下载下来让后上传到自己的服务器单独调用。
以下是html5的js文件中的代码:
复制代码
代码如下:

(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(’,'),i=e.length;while(i–){document.createElement(e[i])}})()

除了在网页中调用包含以上代码的js文件来让IE浏览器支持HTML5元素以外,你也可以以下面这种方式把代码直接添加到网页中。
复制代码
代码如下:

<!–[if IE]>
<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(’,'),i=e.length;while(i–){document.createElement(e[i])}})()
</script>
<![endif]–>
HTML / CSS 相关文章推荐
CSS3教程:新增加的结构伪类
Apr 02 HTML / CSS
image-set实现Retina屏幕下图片显示详细介绍
Dec 24 HTML / CSS
CSS3 Calc实现滚动条出现页面不跳动问题
Sep 14 HTML / CSS
css3实现可拖动的魔方3d效果
May 07 HTML / CSS
CSS实现进度条和订单进度条的示例
Nov 05 HTML / CSS
HTML5边玩边学(3)像素和颜色
Sep 21 HTML / CSS
HTML5 声明兼容IE的写法
May 16 HTML / CSS
HTML5 在canvas中绘制文本附效果图
Jun 23 HTML / CSS
很酷的HTML5电子书翻页动画特效
Feb 25 HTML / CSS
HTML5 canvas基本绘图之图形组合
Jun 27 HTML / CSS
html5的pushstate以及监听浏览器返回事件的实现
Aug 11 HTML / CSS
html form表单基础入门案例讲解
Jul 15 HTML / CSS
HTML5实现的图片无限加载的瀑布流效果另带边框圆角阴影
Mar 07 #HTML / CSS
HTML5中新标签和常用标签详解
Mar 07 #HTML / CSS
html5的websockets全双工通信详解学习示例
Feb 26 #HTML / CSS
HTML5+CSS3应用详解
Feb 24 #HTML / CSS
html5中valid、invalid、required的定义
Feb 21 #HTML / CSS
html5实现多文件的上传示例代码
Feb 13 #HTML / CSS
HTML5 video 视频标签使用介绍
Feb 03 #HTML / CSS
You might like
example1.php
2006/10/09 PHP
谷歌音乐搜索栏的提示功能php修正代码
2011/05/09 PHP
那些年一起学习的PHP(一)
2012/03/21 PHP
PHP命名空间(Namespace)的使用详解
2013/05/04 PHP
详解PHP对数组的定义以及数组的创建方法
2015/11/27 PHP
PHP array_key_exists检查键名或索引是否存在于数组中的实现方法
2016/06/13 PHP
实例解析php的数据类型
2018/10/24 PHP
用js实现手把手教你月入万刀(转贴)
2007/11/07 Javascript
JavaScript开发规范要求(规范化代码)
2010/08/16 Javascript
javascript控制swfObject应用介绍
2012/11/29 Javascript
jQuery制作简洁的多级联动Select下拉框
2014/12/23 Javascript
jQuery入门基础知识学习指南
2015/08/14 Javascript
js数组常用操作方法小结(增加,删除,合并,分割等)
2016/08/02 Javascript
浅析JavaScript中break、continue和return的区别
2016/11/30 Javascript
js cookie实现记住密码功能
2017/01/17 Javascript
vue组件之间的数据传递方法详解
2019/04/19 Javascript
js实现购物车商品数量加减
2020/09/21 Javascript
Vue 实现可视化拖拽页面编辑器
2021/02/01 Vue.js
Python中MYSQLdb出现乱码的解决方法
2014/10/11 Python
Python httplib模块使用实例
2015/04/11 Python
深入解析Python编程中JSON模块的使用
2015/10/15 Python
Python3.6基于正则实现的计算器示例【无优化简单注释版】
2018/06/14 Python
python使用BeautifulSoup与正则表达式爬取时光网不同地区top100电影并对比
2019/04/15 Python
Django 重写用户模型的实现
2019/07/29 Python
Python PIL图片添加字体的例子
2019/08/22 Python
windows下Pycharm安装opencv的多种方法
2020/03/05 Python
css3的图形3d翻转效果应用示例
2014/04/08 HTML / CSS
HTML5重塑Web世界它将如何改变互联网
2012/12/17 HTML / CSS
CHARLES & KEITH澳大利亚官网:新加坡时尚品牌
2019/01/22 全球购物
德国家具折扣店:POCO
2020/02/28 全球购物
自我反省检讨书
2014/01/23 职场文书
共产党员承诺书
2014/03/25 职场文书
电力安全事故反思
2014/04/27 职场文书
英语辞职信范文
2015/02/28 职场文书
navicat 连接Ubuntu虚拟机的mysql的操作方法
2022/04/02 MySQL
Java Redisson多策略注解限流
2022/09/23 Java/Android