javascript - JavaScript で文字列の長さをピクセル単位で測定する

Question

font-size と font-family がわかっている場合、 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幅関数を使用して幅をピクセル幅で取得できます

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

jsfiddleを確認してください