检测浏览器是否支持HTML5/CSS3神器Modernizr

时间:2022-11-23 09:08:29

什么是Modernizr?

Modernizr 是一个用来检测浏览器功能支持情况的 JavaScript 库。 目前,通过检验浏览器对一系列测试的处理情况,Modernizr 可以检测18项 CSS3 功能以及40多项关于HTML5 的功能。 它比传统检测浏览器名称(浏览器嗅探)的方式更为可靠。 一整套测试的执行时间仅需几微秒。 此外,Modernizr 网站通过定制脚本只对你感兴趣的元素进行检测,从而实现效率优化。


传统浏览器目前不会被完全取代,令你难以将最新的 CSS3 或 HTML5 功能嵌入你的网站。 Modernizr 正是为解决这一难题应运而生,作为一个开源的 JavaScript 库,Modernizr 检测浏览器对 CSS3 或 HTML5 功能支持情况。 Modernizr 并非试图添加老版本浏览器不支持的功能,而是令你通过创建可选风格配置修改页面设计。 它也可以通过加载定制的脚本来模拟老版本浏览器不支持的功能。


Modernizr 简单易用,但不是万能的。 成功使用 Modernizr 很大程度上取决于你的 CSS 和 JavaScript 技能。 通过本指南,你可以了解如何为不支持多栏或投影的浏览器设置可选风格。 此外,你还可以了解如何让老版本浏览器对使用最新 HTML5 要求(required)属性的表单进行验证,以及如何根据浏览器的功能有选择地加载脚本文件。


下载 Modernizr


访问 Moderniz 网站,其地址为 http://www.modernizr.com/ 

检测浏览器是否支持HTML5/CSS3神器Modernizr

使用方法:

如判断浏览器是否支持本地存储功能,代码如下

if (Modernizr.localstorage) {
// window.localStorage is available!
} else {
// no native support for local storage :(
// maybe try Gears or another third-party solution
}