怎么知道浏览器是否支持html5

html-css08

怎么知道浏览器是否支持html5,第1张

可以通过检查是否浏览器支持某个特定的html5功能,比如检查是否支持canvas:

var supportCanvas = (typeof document.createElement('canvas').getContext === "function")

if (supportCanvas) {

    // ...

} else {

    alert("检测到您正在使用旧版浏览器,推荐您升级到新版以获取最佳体验!")

}

第二种方法:

function supports_video() {

  return !!document.createElement('video').canPlayType

}

if (supports_video()) {

    // ...

} else {

    alert("检测到您正在使用旧版浏览器,推荐您升级到新版以获取最佳体验!")

}

利用HTML5新标签对象的方法来进行检测,比如Canvas对象的getContext()、Video对象的canPlayType等。如果浏览器支持HTML5,则返回相应的期望值(返回函数体,布尔值为true),否则无法获得期望值(返回undefined,布尔值为false)。

Canvas对象的getContext

// 方法一

/**

 * [supportHtml5 言成科技&HTML5学堂]

 * @return {[type]} [description]

 */

function supportCanvas() {

    return (typeof document.createElement('canvas').getContext === "function")

}

console.log(supportCanvas())

Video对象的canPlayType

// 方法二

/*

 * [supportsVideo 言成科技&HTML5学堂]

 * @return {[type]} [description]

 */

function supportVideo() {

  return !!document.createElement('video').canPlayType

}

console.log(supportVideo())