javascript - 更新字体大小后不计算新的 offsetHeight

Question

我有一个关于“offsetHeight”属性在更新字体大小后没有得到更新的问题。下面是代码。

function shrink_toolbar_text()
{
  var toolbar = document.getElementById("toolbar");
  var icons = document.getElementsByClassName("icon-alone");

  var icon_size = 64;
  var icon_height = icons[0].offsetHeight ;

  while( icon_height > toolbar.offsetHeight)
  {


   // textSpan.style.fontSize = parseInt(textSpan.style.fontSize) - 1;
    icon_size = icon_size -1;
    for ( i=0; i< icons.length ;i++){
      icons[i].style.fontSize = icon_size ; 
    }  

     icon_height = icons[0].offsetHeight ;
    console.log( icon_height);
    console.log( icon_size);
    // console.log( parseInt(icon_size));
  }
  console.log("shrink_toolbar_text() ");
}

对于这种情况有什么解决方法吗？ 到目前为止，我已经尝试过以下事情。 1. 尝试使用显示和隐藏重绘每个图标。 2. 尝试了“getComputedStyle()”，但它根本不返回名为“offsetHeight”的值。

知道为什么代码不起作用吗？

Answer 1

代码应该改成这样。

var icon_size = 64px;

和

icons[i].style.fontSize = icon_size+"px" ;

在某些浏览器中，如果没有后缀“px”，此代码将无法运行。它也不会在控制台上发出错误消息。对此要仔细编码。