javascript - getImageData 之后 insideHTML 不起作用

Question

我使用代码在视频标签中显示网络摄像头显示的内容。

如果支持网络摄像头访问，我每秒都会调用此函数:

function refresh() {
  var h = video.height;
  var w = video.width;
  var img = video.getImageData(0, 0, w, h);
  document.getElementById('text_01').innerHTML = "!";
}

随着 var video 的出现

var video = document.querySelector('video');

问题是，当我像这样放置这些行时，“text_01”的文本会成功更改:

document.getElementById('text_01').innerHTML = "!";
img = video.getImageData(0, 0, w, h);

但不是这样的:

img = video.getImageData(0, 0, w, h);
document.getElementById('text_01').innerHTML = "!";

在某些函数之后使用innerHTML是否有某种限制？

Answer 1

.getImageData是 <canvas> 的函数元素，而不是<video>元素。如果您检查浏览器控制台，您会看到类似 getImageData is not a function 的内容.

这就是 innerHTML 的原因未设置 - 由于错误，代码停止。