Modernizr 是一个用来检测浏览器功能支持情况的JavaScript 库。
通过这个库我们可以检测不同的浏览器对于HTML5特性的支持情况。

使用Modernizr类库和使用其他第三方类库的方法是一样的它分为一下几个步骤“
1、在官网上下载Modernizr类库。modernizr官网：https://modernizr.com/
2、通过JavaSctipt标签引入Modernizr类库
3、通过具体的代码实现对HTML特性的检测。
这里我们写了一个非常简单的例子来检测浏览器是否支持HTML5中的Canvas API，示例如下：
<!doctype html>

<html>

    <head>

        <meta charset="utf-8" />

        <title>通过Modernizr检测HTML5特性</title>

    </head>

    <body>

        <article>

            <h1>通过Modernizr检测HTML5特性</h1>

        </article>

        <div id="result-stub">

            <span id="msg" style="color:red;"></span>

        </div>

        <script >

            window.onload = function() {

                     //通过Modernizr.对浏览器canvas功能进行检测

                     if (Modernizr.canvas) {

                            $('#msg').text('本浏览器支持Canvas API');

                    }else{

                             $('#msg').text('本浏览器不支持Canvas API');

                         }

            }

        </script>

        //引入modernizr库和jquery库

        <script src="../js/jquery.js"></script>

        <script src="../js/modernizr.js"></script>

    </body>

</html>
这些内容关乎到HTML5中第三方类库的使用

HTML5中Modernizr类库的作用和使用的更多相关文章

  1. HTML5中常用的标签(及标签的属性和作用)

    1.标签:<!DOCTYPE>作用:声明是文档中的第一成分,位于<html>标签之前. 2.标签:<html>作用:此元素可告知浏览器其自身是一个HTML文档.属性 ...

  2. 如何使用T-SQL备份还原数据库及c#如何调用执行？ C#中索引器的作用和实现。 jquery控制元素的隐藏和显示的几种方法。 localStorage、sessionStorage用法总结 在AspNetCore中扩展Log系列 - 介绍开源类库的使用（一） span<T>之高性能字符串操作实测

    如何使用T-SQL备份还原数据库及c#如何调用执行? 准备材料:Microsoft SQL Server一部.需要还原的bak文件一只 一.备份 数据库备份语句:user master backup ...

  3. HTML5中Access-Control-Allow-Origin解决跨域问题

    www.111cn.net 更新:2015-01-07 编辑:flyfox 来源:转载 跨域在开发中一些是一个比较常见的问题虽然有json或者xml来解决,现在html5开始流行了,我们可以通过Acc ...

  4. HTML5中引入的关键特性

    新特性 描述 accesskey 定义通过键盘访问元素的快捷键 contenteditable 该特性设置为true时,浏览器应该允许用户编辑元素的内容.不指定变化后的内容如何保存 contextme ...

  5. HTML5中的sessionStorage和localStorage

    html5中的Web Storage包括了两种存储方式:sessionStorage和localStorage. sessionStorage用于本地存储一个会话(session)中的数据,这些数据只 ...

  6. HTML5中的SVG

    * SVG * 基本内容 * SVG并不属于HTML5专有内容 * HTML5提供有关SVG原生的内容 * 在HTML5出现之前,就有SVG内容 * SVG,简单来说就是矢量图 * SVG文件的扩展名 ...

  7. html5中的表单

    <form id="aForm" action="reg.php"> <p>请填写表单内容以完成注册!</p> <fi ...

  8. 4.html5中超链接

    html中超链接都是通过<a>标签实现的,html5也不例外,这里就来探讨一下<a>标签. <a>元素属于文本元素,有一些私有属性或者叫局部属性.那么,相对应的还有 ...

  9. HTML5中script的async属性异步加载JS

    HTML5中script的async属性异步加载JS     HTML4.01为script标签定义了5个属性: charset 可选.指定src引入代码的字符集,大多数浏览器忽略该值.defer 可 ...

随机推荐

  1. 数仓interview总结

    一 数据库 1.1 数据库事务特性ACID 原子性Atomicity,一致性Consistency,隔离性Isolation,持续性Durability 1.2 锁有几种,及范围 从数据库系统角度分为 ...

  2. hdu3579(线性同余方程组)

    Hello Kiki Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others)Total ...

  3. 什么是Mocking framework？它有什么用？（转）

    今天我想讲下关于mocking frameworks,并且解释下他为什么有用处.我将给你们展示用和不用mocking framework两种测试方法. 假设我们已经有了一个Driver类: publi ...

  4. POJ 2031 Building a Space Station【经典最小生成树】

    链接: http://poj.org/problem?id=2031 http://acm.hust.edu.cn/vjudge/contest/view.action?cid=22013#probl ...

  5. Python菜鸟之路：Python基础（三）

    一.编码 推荐阅读<字符编码的前世今生>:http://tgideas.qq.com/webplat/info/news_version3/804/808/811/m579/201307/ ...

  6. python基础-第六篇-6.4模块混战

    我们之前接触多的编程方式就是函数式编程,而且喜欢就一个文件里写完所有的程序代码,这样做在前期感觉还不错,不过一旦你的程序变复杂,在易读性和排错方面就感觉好吃力,功能界限不明显,那今天我们就来讲讲怎么用 ...

  7. Webpack探索【1】--- 基础知识

    本文主要说明Webpack的一些基础内容.

  8. eclipse revert resources 很慢的解决办法

    eclipse启动无响应,停留在Loading workbench状态,或老是加载不了revert resources 做开发的同学们或多或少的都会遇到eclipse启动到一定程度时,就进入灰色无响应 ...

  9. linux 如何查找命令的路径

    linux 下,我们常使用 cd ,grep,vi 等命令,有时候我们要查到这些命令所在的位置,如何做呢? linux下有2个命令可完成该功能:which ,whereis which 用来查看当 前 ...

  10. ubuntu vim退出时出错

    E505: "vimrc" is read-only (add ! to override) wq退出时加!强制保存退出 "vimrc" E212: Can't ...