使用jQuery计算块级元素中文本节点的宽度

假设我有：

<div>Some variable amount of text.</div>

一些可变数量的文本。

如何获取div中文本的宽度（以像素为单位）

请记住，文本的数量会因div的不同而发生不可预测的变化

谢谢

var w = $('div').width()

或者对div使用任何其他选择器，只需使用width（），如下所示：

text
警报（$（'#mydiv'）.width（））；

听起来您想要的是内容的宽度，而不是其他人提供的div本身的宽度。我认为您需要将内容包装在一个跨度中，这样您就可以测量跨度的宽度。div将始终尽可能宽。你需要一些可以折叠到你可以测量的内容大小的东西。

关于@mrtsherman，如果你只想要你可以使用的文本的宽度

var myDiv = $('#myDiv'); 

//div width
var textWidth = sb.width();

//remove padding and margin from left and right
textWidth -= parseInt(sb.css('padding-left') ) + parseInt(sb.css('margin-left') );
textWidth -= parseInt(sb.css('padding-right') ) + parseInt(sb.css('margin-right') );

---

我发现最好的方法是使用CSS规则“display:inline；”“只绑定给定HTML元素的

textNode

，然后使用

offsetWidth

JS方法

<div style="display:inline;" id="gotWidthInPixels" >Some variable amount of text.</div>
<script>
  //either:
  var widthInPixels= $('#gotWidthInPixels')[0].offsetWidth; 
  //or
  var widthInPixels= document.getElementById("gotWidthInPixels").offsetWidth;
</script>

一些可变数量的文本。
//要么：
var widthInPixels=$（'#gotWidthInPixels'）[0].offsetWidth；
//或
var widthInPixels=document.getElementById（“gotWidthInPixels”）.offsetWidth；

---

这将为您提供任何HTML元素的精确宽度（以像素为单位）。

我遇到了一些奇怪的问题，在jquery中，空格打破了宽度计算。不知道确切的原因，如果是因为字符串变量和连接，或者是JMVC框架，或者只是jQuery

但是，使空间成为非破缺空间

 

---

似乎解决了这个问题。只是把它扔出去以防万一

你想要达到什么效果，需要知道像素宽度？很多时候，这些情况下有一个解决方案，不需要实际的像素值…谢谢@mrtsherman，这也是我开始认为我需要走的方向。