CanvasRenderingContext2D：measureText() 方法

基线 广泛可用

此功能已得到很好的建立，并且可以在许多设备和浏览器版本中使用。自以下日期起，它已在所有浏览器中可用： 2015年7月.

CanvasRenderingContext2D.measureText() 方法返回一个 TextMetrics 对象，其中包含有关已测量文本的信息（例如其宽度）。

语法

js
measureText(text)

参数

text

要测量的文本字符串。

返回值

一个 TextMetrics 对象。

示例

给定此 <canvas> 元素

html
<canvas id="canvas"></canvas>

…您可以使用以下代码获取 TextMetrics 对象

js
const canvas = document.getElementById("canvas");
const ctx = canvas.getContext("2d");

let text = ctx.measureText("Hello world");
console.log(text.width); // 56;

规范

规范
HTML 标准
# dom-context-2d-measuretext-dev

浏览器兼容性

BCD 表格仅在启用 JavaScript 的浏览器中加载。

另请参阅