javascript - 替换后在 div 中拟合文本

Question

我有以下 JavaScript：

var answer = prompt('what is input', ' ');

$('.words').text(answer); 

它会提示输入一些文本，然后替换 div 中已经使用 .words 样式的文本，该 .words 已经具有固定的宽度和长度。div 将文本居中对齐，但如果用户输入的字数过多，文本会从 div 中流出，该 div 有边框，看起来很糟糕。此外，如果用户输入的字数太少，则 div 中会有很多空白空间。是否有我可以插入的脚本来缩小字体大小以容纳额外的文本或扩大字体大小以更好地适应 div 中的文本（如果用户输入的文本不多）。谢谢

Answer 1

var answer = prompt('what is input', ' ');
$('.words').html(answer);

现场演示