第一章的知識點:

Modernizr 是一個用來檢測瀏覽器功能支持狀況的 JavaScript 庫。經過這個庫咱們能夠檢測不一樣的瀏覽器對於HTML5特性的支持狀況。使用Modernizr類庫和使用其餘第三方類庫的方法是同樣的它分爲一下幾個步驟「
一、在官網上下載Modernizr類庫。modernizr官網:https://modernizr.com/
二、經過JavaSctipt標籤引入Modernizr類庫
三、經過具體的代碼實現對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>html

相關文章
相關標籤/搜索