html - 空白の幅を取得するにはどうすればよいですか？

Question

文字列を正確な幅にカットする機能があります。これをこれと呼びます。cut()

cut('abcd',3) = 'abc'

私が使用しているフォントファミリはArial

whitespaceしかし、各文字の幅を計算すると、奇妙で​​あることがわかりました。

<span id='x'> </span>

使用する$("#x").width()と0.0になりました

whitespaceそうではないことに注意してください&nbsp

なぜ' ' = 0.0ですが'a b' that ' ' != 0.0

のルールは何whitespaceですかHTML？

Answer 1

white-space: pre;スペースを強制的にレンダリングするために使用できます。

#x {
  white-space: pre;
}

幅は次のとおりです：http 4px：//jsfiddle.net/qgeUZ/1/

Answer 2

ここで紹介されているように、これを試してください：テキスト幅の計算

$.fn.textWidth = function(){
      var html_org = $(this).html();
      var html_calc = '<span>' + html_org + '</span>';
      $(this).html(html_calc);
      var width = $(this).find('span:first').width();
      $(this).html(html_org);
      return width;
    };

//カット関数