HTMLCanvasElement

从其父级 HTMLElement 继承属性。

HTMLCanvasElement.height

height <canvas> 元素的 HTML 属性是一个非负 integer，它反映了画布一列向下延伸的逻辑像素（或 RGBA 值）的数量。当属性未指定或设置为无效值（例如负数）时，将使用默认值 150。如果未向 <canvas> 分配 [单独的] CSS 高度，则此值也将用作画布在长度单位 CSS 像素中的高度。

HTMLCanvasElement.width

width <canvas> 元素的 HTML 属性是一个非负 integer，它反映了画布一行向右延伸的逻辑像素（或 RGBA 值）的数量。当属性未指定或设置为无效值（例如负数）时，将使用默认值 300。如果未向 <canvas> 分配 [单独的] CSS 宽度，则此值也将用作画布在长度单位 CSS 像素中的宽度。

HTMLCanvasElement.mozOpaque 非标准 已弃用

一个布尔值，反映了 moz-opaque <canvas> 元素的 HTML 属性。它让画布知道半透明是否会是一个因素。如果画布知道没有半透明，则可以优化绘画性能。这仅在基于 Mozilla 的浏览器中受支持；请改用标准化的 canvas.getContext('2d', { alpha: false })。

HTMLCanvasElement.mozPrintCallback 非标准

一个最初为 null 的 function。Web 内容可以将其设置为将在页面打印时调用以重新绘制画布的 JavaScript 函数。当被调用时，回调函数将传递一个实现 MozCanvasPrintState 接口的“printState”对象。回调函数可以从 printState 对象中获取要绘制的上下文，并且在完成后必须在上面调用 done()。mozPrintCallback 的目的是在所用打印机的分辨率下获得画布更高分辨率的渲染。 查看此博客文章。

从其父级 HTMLElement 继承方法。

HTMLCanvasElement.captureStream()

返回一个 CanvasCaptureMediaStreamTrack，它是画布表面实时视频捕获。

HTMLCanvasElement.getContext()

在画布上返回一个绘图上下文，如果上下文 ID 不受支持，则返回 null。绘图上下文允许您在画布上绘制。使用 "2d" 调用 getContext 将返回一个 CanvasRenderingContext2D 对象，而使用 "webgl"（或 "experimental-webgl"）调用它将返回一个 WebGLRenderingContext 对象。此上下文仅在实现 WebGL 的浏览器中可用。

HTMLCanvasElement.toDataURL()

返回一个 data-URL，其中包含以 type 参数（默认为 png）指定的格式表示的图像。返回的图像的分辨率为 96dpi。

HTMLCanvasElement.toBlob()

创建一个 Blob 对象，表示画布中包含的图像；此文件可以根据用户代理的决定缓存到磁盘或存储在内存中。

HTMLCanvasElement.transferControlToOffscreen()

将控制权转移到一个 OffscreenCanvas 对象，无论是主线程还是工作线程。

从其父级 HTMLElement 继承事件。

使用 addEventListener() 监听这些事件，或者将事件侦听器分配到此接口的 oneventname 属性。

contextlost

如果浏览器检测到 CanvasRenderingContext2D 上下文已丢失，则触发该事件。

contextrestored

如果浏览器成功恢复 CanvasRenderingContext2D 上下文，则触发该事件

webglcontextcreationerror

如果用户代理无法创建 WebGLRenderingContext 或 WebGL2RenderingContext 上下文，则触发该事件。

webglcontextlost

如果用户代理检测到与 WebGLRenderingContext 或 WebGL2RenderingContext 对象关联的绘图缓冲区已丢失，则触发该事件。

webglcontextrestored

如果用户代理恢复了 WebGLRenderingContext 或 WebGL2RenderingContext 对象的绘图缓冲区，则触发该事件。

• 实现此接口的 HTML 元素：<canvas>