measureText()

实例

在画布上输出文本之前，检查字体的宽度：

YourbrowserdoesnotsupporttheHTML5canvastag. var c=document.getElementById("myCanvas"); var canvOK=1; try {c.getContext("2d");} catch (er) {canvOK=0;} if (canvOK==1) { var ctx=c.getContext("2d"); ctx.font="30px Arial"; var txt="Hello World" ctx.fillText("width:" + ctx.measureText(txt).width,10,50) ctx.fillText(txt,10,100); }

JavaScript：

var c=document.getElementById("myCanvas");var
ctx=c.getContext("2d");ctx.font="30px Arial";
var txt="Hello World"ctx.fillText("width:" + ctx.measureText(txt).width,10,50)
ctx.fillText(txt,10,100);

浏览器支持

Internet Explorer 9、Firefox、Opera、Chrome 和 Safari 支持 measureText()方法。
注意：Internet Explorer 8 及之前的版本不支持元素。

定义和用法

measureText()方法返回一个对象，该对象包含以像素计的指定字体宽度。

提示：如果您需要在文本向画布输出之前，就了解文本的宽度，那么请使用该方法。

JavaScript 语法：	context.measureText(text).width;

参数值

参数	描述
text	要测量的文本。

鹏仔微信 15129739599 鹏仔QQ344225443 鹏仔前端 pjxi.com 共享博客 sharedbk.com