返回错误长度的文本长度

Question

我正在自动调整文本字体大小，效果很好，但我还想计算文本长度。但我的长度不对。这是 Fiddler 代码。有人能告诉我我做错了什么吗？

var len=$(targetid).text().length;

    alert(len);

我正在使用 text().length 方法，但我得到了错误的值。

$('.jtextfill').textfill({ maxFontPixels: 36 },'h1');
$('.jtextfill2').textfill({ maxFontPixels: 36 },'h2');
$('.jtextfill3').textfill({ maxFontPixels: 36 },'h3');

Answer 1

这是因为空文本节点创建的前导和尾随空格，您可以trim文本将其删除

var len=$(targetid).text().trim().length;

演示：Fiddle

Answer 2

我认为你的问题是它也在计算空格，你应该 trim 阅读长度之前的文本。

$($(targetid).text()).trim().length

Answer 3

这是因为 .text() 包含 .jtextfill 元素的子元素 span 周围的空白。

选项 1 - 删除空格 (JSFiddle):

<h1 id="h1" class='jtextfill'><span>Sample1</span></h1>
<h2 id="h2" class='jtextfill2'><span>Sample2</span></h2>
<h3 id="h3" class='jtextfill3'><span>Sample3</span></h3>

选项 2 - $.trim 空格 (JSFiddle):

var len = $.trim($(targetid).text()).length; 

现代浏览器替代品：

var len = $(targetid).text().trim().length;

Answer 4

text() 方法返回 h1、h2 和 h3 标签内的文本，以及它们周围的空格和换行符。

您需要确保在测试长度之前 trim():

var len=$(targetid).text().trim().length;