如何使用 Modernizr 来检测画布支持答案

【问题标题】：How to user modernizr to detect canvas support如何使用 Modernizr 来检测画布支持
【发布时间】：2015-01-22 08:00:31
【问题描述】：

我想要做的就是在浏览器中检测 Canvas 支持。 Modernizr 的“文档”页面有 1000 行长，但似乎无法简单地解释特征检测（它的主要功能），而是对 polyfills 大喊大叫。无论如何，这个：

Modernizr.canvas

只返回undefined 而不是true 或false。如何让 Modernizr 真正告诉我浏览器中是否存在此功能？

【问题讨论】：

标签： modernizr

【解决方案1】：

当事情不受支持时，Modernizr 不会报告false。它只报告true（如果是），只是让不受支持的属性未定义这一事实作为虚假值。

例如，在我使用的 Firefox 中，Modernizr.canvas 报告 true。在旧的 Android 版本上，它报告undefined，在条件下相当于false：

if (Modernizr.canvas) {
  // do canvasy things
} else {
  // notify users that you need canvas, and their browser won't work
}

它对所有事情都这样做：如果支持，那就是真的。如果不是，它实际上不是 Modernizr 对象上的属性，因此调用将使 JS 引擎根据 JavaScript 规范报告 undefined。

【讨论】：