所提出的迭代解决方案可以在两个方面显著加速:

1)将字体大小乘以某个常数，而不是加或减1。

2)首先，使用零过程常数，比如，将每个循环的大小增加一倍。然后，有了一个大致的想法从哪里开始，做同样的事情，并进行更精细的调整，比如乘以1.1。虽然完美主义者可能想要理想字体的精确整数像素大小，但大多数观察者不会注意到100和110像素之间的区别。如果你是一个完美主义者，那么重复第三次，做更细致的调整。

我没有编写特定的例程或插件来回答确切的问题，而是依赖于基本思想并编写代码的变体来处理各种布局问题，而不仅仅是文本，包括拟合div、跨度、图像……通过宽度、高度、面积、……在容器中，匹配另一个元素....

这里有一个例子:

  var                           nWindowH_px             = jQuery(window).height();
  var                           nWas                    = 0;
  var                           nTry                    = 5;

  do{
   nWas = nTry;
   nTry *= 2;
   jQuery('#divTitle').css('font-size' ,nTry +'px');
  }while( jQuery('#divTitle').height() < nWindowH_px );

  nTry = nWas;

  do{
   nWas = nTry;
   nTry = Math.floor( nTry * 1.1 );
   jQuery('#divTitle').css('font-size' ,nTry +'px');
  }while( nWas != nTry   &&   jQuery('#divTitle').height() < nWindowH_px );

  jQuery('#divTitle').css('font-size' ,nWas +'px');

大多数其他答案使用循环来减少字体大小，直到它适合div，这是非常缓慢的，因为页面需要重新渲染元素每次字体改变大小。我最终不得不编写自己的算法，使它能够定期更新内容，而不会冻结用户浏览器。我添加了一些其他功能(旋转文本，添加填充)，并将其打包为jQuery插件，你可以在:

https://github.com/DanielHoffmann/jquery-bigtext

简单的电话

$("#text").bigText();

它会非常适合你的容器。

在这里看到它的行动:

http://danielhoffmann.github.io/jquery-bigtext/

现在它有一些限制，div必须有固定的高度和宽度，它不支持将文本包装成多行。

我将努力获得一个选项来设置最大字体大小。

编辑:我发现了更多的问题与插件，它不处理其他盒子模型除了标准的和div不能有边缘或边界。我会努力的。

Edit2:我现在已经修复了这些问题和限制，并添加了更多选项。你可以设置最大字体大小，你也可以选择限制字体大小使用宽度，高度或两者。我将在包装器元素中接受max-width和max-height值。

Edit3:我已经将插件更新到1.2.0版本。对代码和新选项(verticalAlign, horizontalAlign, textAlign)进行了重大清理，并支持span标签内的内部元素(如换行或字体很棒的图标)。

我用geekMonkey解决方案，但它太慢了。他所做的就是将字体大小调整到最大(maxFontPixels)，然后检查它是否适合容器。否则，它将字体大小减小1px，并再次检查。为什么不简单地检查前一个容器的高度并提交该值呢?(是的，我知道为什么，但我现在做了一个解决方案，这只适用于高度，也有一个最小/最大选项)

这里有一个更快的解决方案:

var index_letters_resize;
(index_letters_resize = function() {
  $(".textfill").each(function() {
    var
      $this = $(this),
      height = Math.min( Math.max( parseInt( $this.height() ), 40 ), 150 );
    $this.find(".size-adjust").css({
      fontSize: height
    });
  });
}).call();

$(window).on('resize', function() {
  index_letters_resize();
);

这就是HTML:

<div class="textfill">
  <span class="size-adjust">adjusted element</span>
  other variable stuff that defines the container size
</div>

同样，这个解决方案只检查容器的高度。这就是为什么这个函数不需要检查元素是否在里面。但我也实现了一个最小/最大值(40min, 150max)，所以对我来说，这是完美的(也适用于窗口大小调整)。

所提出的迭代解决方案可以在两个方面显著加速:

1)将字体大小乘以某个常数，而不是加或减1。

2)首先，使用零过程常数，比如，将每个循环的大小增加一倍。然后，有了一个大致的想法从哪里开始，做同样的事情，并进行更精细的调整，比如乘以1.1。虽然完美主义者可能想要理想字体的精确整数像素大小，但大多数观察者不会注意到100和110像素之间的区别。如果你是一个完美主义者，那么重复第三次，做更细致的调整。

我没有编写特定的例程或插件来回答确切的问题，而是依赖于基本思想并编写代码的变体来处理各种布局问题，而不仅仅是文本，包括拟合div、跨度、图像……通过宽度、高度、面积、……在容器中，匹配另一个元素....

这里有一个例子:

  var                           nWindowH_px             = jQuery(window).height();
  var                           nWas                    = 0;
  var                           nTry                    = 5;

  do{
   nWas = nTry;
   nTry *= 2;
   jQuery('#divTitle').css('font-size' ,nTry +'px');
  }while( jQuery('#divTitle').height() < nWindowH_px );

  nTry = nWas;

  do{
   nWas = nTry;
   nTry = Math.floor( nTry * 1.1 );
   jQuery('#divTitle').css('font-size' ,nTry +'px');
  }while( nWas != nTry   &&   jQuery('#divTitle').height() < nWindowH_px );

  jQuery('#divTitle').css('font-size' ,nWas +'px');

你可以使用FitText.js (github页面)来解决这个问题。与TextFill相比是非常小和有效的。TextFill使用了昂贵的while循环，而FitText没有。

FitText也更灵活(我在一个有非常特殊要求的项目中使用它，工作起来像个冠军!)。

HTML:

<div class="container">
  <h1 id="responsive_headline">Your fancy title</h1>
</div>

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script src="jquery.fittext.js"></script>
<script>
  jQuery("#responsive_headline").fitText();
</script>

你也可以设置选项:

<script>
  jQuery("#responsive_headline").fitText(1, { minFontSize: '30px', maxFontSize: '90px'});
</script>

CSS:

#responsive_headline {
   width: 100%;
   display: block;
}

如果你需要它，FitText也有一个非jquery版本。

我确实喜欢

let name = "Making statements based on opinion; back them up with references or personal experience."
let originFontSize = 15;
let maxDisplayCharInLine = 50; 
let fontSize = Math.min(originFontSize, originFontSize / (name.length / maxDisplayCharInLine));