在javascript中测量字符串的像素长度

Measuring length of string in pixel in javascript

本文关键字:像素 字符串 javascript 测量      更新时间:2023-09-26

如果我知道font-size和font-family,我如何在javascript中找到字符串的像素长度?

最简单的解决方案是创建一个内存画布(即一个不添加到DOM),然后使用measureText函数:

var canvas = document.createElement('canvas');
var ctx = canvas.getContext("2d");
ctx.font = "11px Arial";        
var width = ctx.measureText(str).width;

你可以把你的字符串放到段落中,并使用jquery的width函数来获取宽度(以像素为单位)

    function showWidth(ele, w) {
$("div").text("The width for the " + ele +
" is " + w + "px.");
}
$("#getp").click(function () {
showWidth("paragraph", $("p").width());
});

检查jsfiddle