javascript - 在javascript中以像素为单位测量字符串的长度

Question

如果我知道字体大小和字体系列，如何在 javascript 中找到以像素为单位的字符串长度？

Answer 1

最简单的解决方案是创建一个内存画布（即未添加到 DOM 的画布），然后使用以下measureText函数：

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

Answer 2

您可以将字符串放入段落中并使用 jquery width 函数来获取像素宽度的宽度

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

检查jsfiddle