一个非常棒的 JavaScript 框架叫做 Modernizr（http://www.modernizr. com），用于向缺少 HTML5/CSS3特性支持的浏览器打补丁。由 Alexander Farkas编写的
“Webshims Lib”（http://afarkas.github.com/webshim/demos/）就是构建于 Moderniz和无处 不在的 jQuery之上的，它可用于插入表单补丁（也可以为其他 HTML5特性打补丁），从
而使不支持新特性的浏览器可以处理 HTML5 表单。最值得称道的一点是，它利用了 Modernizr 的加载功能，能做到只加载实际所需的补丁。如果在原生支持 HTML5 新特性
的浏览器中查看网页，则仅会给网页加入一丁点儿冗余代码。而对于老版本浏览器，虽 然它们需要加载更多的代码（因为它们本身能力不足），但通过相关 JavaScript 方法的辅
助，它们能提供基本一致的用户体验。 通过打补丁受益的不仅仅只是老版本浏览器。我们知道，现在的很多浏览器也没有完全
实现 HTML5 的表单特性。在网页中引入 Webshims Lib 可以弥补这些浏览器的缺陷。例 如在 Safari中，提交一个必填项为空的 HTML5表单时不会有任何警告信息。其实这个表
单根本不会提交，但它也没给用户任何反馈，这一点都不人性化。在页面中引入 Webshims
Lib 后，上述问题会得到弥补：
 
 
首先下载 Webshims Lib（http://github.com/aFarkas/webshim/downloads）并解压。然后将
其中的 js-webshim 文件夹复制到相应的位置。为简便起见，本例中我将其拷贝到网站的
根目录，然后在页面的 <head> 部分加入如下代码：
<script src="js/jquery-1.7.1.js"></script>
<script src="js-webshim/minified/extras/modernizr- custom.js"></script>
<script src="js-webshim/minified/polyfiller.js"></script>
 
<script>
//加载补丁
$.webshims.polyfill();
</script>
分析一下这段代码。首先引入了一个本地的 jQuery库文件（可以在 www.jquery.com上下
载最新版本）：
<script src="js/jquery-1.7.1.js"></script>
接着，又引入了 Webshims Lib所包含的 Modernizr以及补丁相关的 JavaScript文件：
<script src="js-webshim/minified/extras/modernizr-custom.js"></script>
<script src="js-webshim/minified/polyfiller.js"></script>
最后，使用初始化脚本来加载所需的补丁：
<script>
//加载补丁
$.webshims.polyfill();
</script>
搞定。现在，浏览器缺失的新功能都会通过相关补丁脚本被自动追加进来了。
 
 
 

转载请注明出处！

http://www.cnblogs.com/libingbin/

感谢您的阅读。如果文章对您有用，那么请轻轻点个赞，以资鼓励。

如何给不支持新特性的浏览器打补丁(让老版本IE兼容新特性)的更多相关文章

  1. atitit.js 各版本 and 新特性跟浏览器支持报告

    atitit.js 各版本 and 新特性跟浏览器支持报告 一个完整的JavaScript实现是由以下3个不同部分组成的 •核心(ECMAScript)--JavaScript的核心ECMAScrip ...

  2. ECMAScript和JavaScript的区别，ECMAScript发展更新历史，ECMAScript5和ECMAScript6的新特性及浏览器支持情况，ECMAScript 5/ECMAScript 2015正式发布

    ECMAScript和JavaScript的区别 ECMA是European Computer Manufacturers Association的缩写,即欧洲计算机制造商协会.欧洲计算机制造商协会是 ...

  3. html5有哪些新特性、移除了那些元素？如何处理HTML5新标签的浏览器兼容问题？如何区分 HTML 和 HTML5？

    * HTML5 现在已经不是 SGML(标准通用标记语言,是一种定义电子文档结构和描述其内容的国际标准语言) 的子集,主要是关于图像,位置,存储,多任务等功能的增加.   * 拖拽释放(Drag an ...

  4. HTML5 的新特性以及新标签的浏览器兼容问题

    新特性: HTML5 现在已经不是 SGML 的子集,主要是关于图像,位置,存储,多任务等功能的增加. 1)  拖拽释放(Drag and drop) API 2)  语义化更好的内容标签(heade ...

  5. html5\CSS3有哪些新特性、移除了哪些元素？如何处理HTML5新标签的浏览器兼容问题？如何区分HTML和HTML5？

    (1)HTML5现在已经不是SGML的子集,主要是关于图像,位置,存储,地理定位等功能的增加. 绘画canvas元素: 用于媒介回放的video和audio元素: 本地离线存储localStorage ...

  6. HTML5有哪些新特性，移除了哪些元素？如何处理HTML5新标签的浏览器兼容性问题？如何区分HTML和HTML5？

    HTML5现在已经不是SGML的子集,主要是关于图像,位置,存储,多任务等功能的增加. 绘画canvas: 用于媒介回放的video和audio元素: 本地离线存储localStorage长期存储数据 ...

  7. 4. CSS新特性之浏览器私有前缀

    1. 浏览器私有前缀 浏览器私有前缀是为了兼容老版本的写法,比较新版本的浏览器无需添加 -moz-:代表firefox浏览器私有属性 -ms-:代表ie浏览器私有属性 -webkit-:代表safar ...

  8. 第四节：教你如何快速让浏览器兼容ES6特性

    写在正文前,本来这一节的内容应该放在第二节更合适,因为当时就有同学问ES6的兼容性如何,如何在浏览器兼容ES6的特性,这节前端君会介绍一个抱砖引玉的操作案例. 为什么ES6会有兼容性问题? 由于广大用 ...

  9. 解决浏览器兼容ES6特性

    为什么ES6会有兼容性问题? 由于广大用户使用的浏览器版本在发布的时候也许早于ES6的定稿和发布,而到了今天,我们在编程中如果使用了ES6的新特性,浏览器若没有更新版本,或者新版本中没有对ES6的特性 ...

随机推荐

  1. 使用nginx解决跨域问题（flask为例）

    背景 我们单位的架构是在api和js之间架构一个中间层(python编写),以实现后端渲染,登录状态判定,跨域转发api等功能.但是这样一个中间会使前端工程师的工作量乘上两倍,原本js可以直接ajax ...

  2. MySQL参数

    1. sql_safe_updates 官方解释如下: , MySQL aborts . 默认为0,如果设置为1,则delete操作和update操作必须带有where子句,且where子句中的列必须 ...

  3. CentOS 7中如何安装mysql server

    以前一直用RHEL 6.3和6.4,系统盘里自带了mysql server,配置好yum源后,直接yum install mysql-server就可安装mysql服务器端了,最近用CentOS 7. ...

  4. JavaScript sync and async（同步和异步）

    推荐四篇文章: JavaScript 是单线程的深入分析 JavaScript 运行机制详解:再谈 Event Loop JavaScript 异步编程的4种方法 JavaScript 既是单线程又是 ...

  5. 拨乱反正：DDD 回归具体的业务场景，Domain Model 再再重新设计

    首先,把最真挚的情感送与梅西,加油! 写在前面 阅读目录: 重申业务场景 Domain Model 设计 后记 上一篇<设计窘境:来自 Repository 的一丝线索,Domain Model ...

  6. IE里面的一些BUG记录

    网上已经有很多类似的记录了,这里写这个是给自己在项目中碰到的问题做个简单的记录,以后将持续更新 1.IE67 border-bottom失效      一个a标签,想要使用移上去后会在下面显示一个横条 ...

  7. spring整合hibernate的时候报异常org.hibernate.HibernateException: createQuery is not valid without active transaction

    在整合Spring4+hibernate4时候,当代码执行到dao中CRUD操作时,报了一个异常, org.hibernate.HibernateException: createQuery is n ...

  8. 【JUC】JDK1.8源码分析之CyclicBarrier（四）

    一.前言 有了前面分析的基础,现在,接着分析CyclicBarrier源码,CyclicBarrier类在进行多线程编程时使用很多,比如,你希望创建一组任务,它们并行执行工作,然后在进行下一个步骤之前 ...

  9. PHP之时间处理

    面试的时候有一道题是这样的:封装一个函数实现,给你一个时间,输出这个时间的对应的这一天是星期几,其实无非就是一些时间格式的处理: date_default_timezone_set('PRC'); / ...

  10. 从SqlServer转手Oracle的一些坑

    为将SqlSugar ORM转制成OracleSugar ORM 本想一天搞定,凭着经验不看任何Oracle资料就直接强上了,但是从配置PLSQL和一些语法区别带来了很多坑让我进度放缓 这个贴子对于身 ...