检测 HTML5 <canvas> 的最佳方法不支持 [英] Best way to detect that HTML5 <canvas> is not supported

问题描述

处理浏览器不支持 HTML5 <canvas> 标签情况的标准方法是嵌入一些后备内容，如:

The standard way to deal with situations where the browser does not support the HTML5 <canvas> tag is to embed some fallback content like:

<canvas>Your browser doesn't support "canvas".</canvas>

但页面的其余部分保持不变，这可能是不恰当的或误导性的.我想要某种检测画布不支持的方法，以便我可以相应地呈现页面的其余部分.你会推荐什么?

But the rest of the page remains the same, which may be inappropriate or misleading. I'd like some way of detecting canvas non-support so that I can present the rest of my page accordingly. What would you recommend?

推荐答案

这是 Modernizr 中使用的技术，基本上所有其他的画布库都使用了这种技术:

This is the technique used in Modernizr and basically every other library that does canvas work:

function isCanvasSupported(){
  var elem = document.createElement('canvas');
  return !!(elem.getContext && elem.getContext('2d'));
}

由于您的问题是在不支持时进行检测，因此我建议您像这样使用它:

Since your question was for detection when it's not supported, I recommend using it like so:

if (!isCanvasSupported()){ ...

这篇关于检测 HTML5 <canvas> 的最佳方法不支持的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！