文本根据宽度，for循环在元素中调整大小

Question

https://jsfiddle.net/bx060jsd/10/

我在下面创建了JavaScript / jQuery：

        curWidth = document.getElementById('tagPhrase').offsetHeight;
    for (i = 30; curWidth > 100; i--) {
        $('#tagPhrase').css("font-size", i);
    }

设计用于降低#tagPhrase内的字体大小，同时#tagPhrase的offsetHeight大于100.但它似乎无法正常工作。我错过了什么？

Answer 1

试试这个：

<强> HTML

<p id="tagPhrase" style="font-size:50px">
Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Aenean commodo ligula eget dolor. Aenean massa. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. 
</p>

<强>使用Javascript：

var element = document.getElementById('tagPhrase'), 
    curWidth = element.offsetWidth,
  currentFontSize = parseInt(element.style.fontSize);

while(curWidth > 100 && currentFontSize > 2) {
    currentFontSize--;
  element.style.fontSize = currentFontSize+"px";
  curWidth = element.offsetWidth;
}

<强>演示：

https://jsfiddle.net/vz2j8baj/