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. 《Lucene in Action 第二版》第4章节 学习总结 -- Lucene中的分析

    通过第四章的学习,可以了解lucene的分析过程是怎样的,并且可以学会如何使用lucene内置分析器,以及自定义分析器.下面是具体总结 1. 分析(Analysis)是什么? 在lucene中,分析就 ...

  2. 在Windows 10中开启开发者模式

    及以上)的电脑上使用Visual Studio来开发Windows 10或者Windows 8.1的应用,你可能会遇到下面的问题,要求你开启开发者模式. 于是你跑到设置里面,把开发者模式打开: 结果你 ...

  3. git学习之时光机穿梭（四）

    时光机穿梭 我们已经成功地添加并提交了一个readme.txt文件,现在,是时候继续工作了,于是,我们继续修改readme.txt文件,改成如下内容: Git is a distributed ver ...

  4. unity中动态生成网格

    以下是绘制正方形面片的一个例子,方便之后查阅: 效果如图所示: 红轴为x方向,蓝轴为z方向. 代码如下: using System.Collections; using System.Collecti ...

  5. C语言基础知识【程序结构】

    C 程序结构1.C 程序主要包括以下部分:预处理器指令函数变量语句 & 表达式注释2.#include <stdio.h> int main(){   /* 我的第一个 C 程序 ...

  6. u-boot下载模式LCD显示图片修改方法（基于TQ2440）

    1.明确液晶型号,这点非常重要,我手头的液晶是天嵌4.3寸屏,让人很郁闷的是液晶背面竟然写着LCD 3.5,这一点让我在上面浪费了好几个小时: 2.根据液晶型号,修改u-boot1.1.6--> ...

  7. 3.二级接口HierarchicalBeanFactory

    HierarchicalBeanFactory   字面意思是分层工厂, 那么这个工厂是怎么分层的呢? package org.springframework.beans.factory; //分层工 ...

  8. 还在用 kill -9 停机？这才是最优雅的姿势（转）

    _ 最近瞥了一眼项目的重启脚本,发现运维一直在使用 kill-9<pid> 的方式重启 springboot embedded tomcat,其实大家几乎一致认为:kill-9<pi ...

  9. centos6安装nginx最详细步骤

    第一步:在centos下面下载 nginx          wget http://nginx.org/download/nginx-1.2.9.tar.gz 解压 tar zxf nginx-1. ...

  10. QT里面的delay使用

    void delay() { QTime dieTime= QTime::currentTime().addSecs(1); while( QTime::currentTime() < dieT ...