Question

我有一个HTML / JavaScript SPA，我想检查浏览器是否支持屏幕外画布。

我尝试过

var canvasTest = document.createElement('canvas-test');

if(typeof canvasTest.transferControlToOffscreen === "function")
{
   return true;
}
else
{
   return false;
}

但是它不起作用（即即使浏览器实际上支持它也返回false）

我正在使用以下代码检查该功能是否存在： How to check if function exists in JavaScript?

Answer 1

代码存在的问题是您创建了一个canvas-test dom元素，它与canvas不同。

尝试一下。

var canvasTest = document.createElement('canvas');

if(typeof canvasTest.transferControlToOffscreen === "function")
{
   console.log('true');
}
else
{
   console.log('false');
}

Answer 2

您可以检查画布的原型，这是比创建画布元素更为轻巧的方法。

if (HTMLCanvasElement.prototype.transferControlToOffscreen) {
  console.log('support for transferring control of an offscreen canvas exists');
} else {
  console.log('support for transferring control of an offscreen canvas does NOT exist');
}

请注意，OffscreenCanvas和将画布转移到屏幕外画布的支持在技术上不是一回事。尽管浏览器支持OffscreenCanvas的可能性为0％，但不支持将画布的控件转移到一个。因此，从技术上来说，要检查OffscreenCanvas支持，您可以这样做

if (typeof OffscreenCanvas !== 'undefined') {
  console.log('OffscreenCanvas is supported');
} else {
  console.log('OffscreenCanvas is NOT supported');
}

检查对屏幕外画布的支持

2 个答案: