Javascript：元素大小更改处理程序（非css）

有一个div，它具有以下样式：

min-width:100px
min-height:100px

当我向div添加一些文本（使用JavaScript）时，它会更改其大小。如何得到新的尺寸

我试过了

element.offsetHeight

但它并没有像预期的那样起作用。我第一次穿的尺寸比我需要的大。但过了一段时间，若我再次得到这个属性的值，我会得到真实的大小

也许是因为在设置文本和将其放入div之间有一段时间？我不知道

<div class="parent"><div class="popup"></div></div>
<style>
  * {
    box-sizing:border-box;
  }
  .parent {
    position: absolute;
    z-index: 0;
  }
  .popup {
    position: absolute;
    min-width: 100px;
    min-height: 100px;
    padding: 20px;
    border-radius: 12px;
    background:#000;
    color:#fff;
    visibility:hidden;
  }
  .popup:before, .popup::before, .popup:after, .popup::after {
    content:"";
    width:0px;
    height:0px;
    display: block;
    position: absolute;
  }
</style>
<script>
  var popup = document.getElementsByClassName('popup')[0];
  popup.innerHTML = 'любой текст от 3 до NNN строк';
  console.log(popup.offsetHeight);
</script>

* {
框大小：边框框；
}
.家长{
位置：绝对位置；
z指数：0；
}
.弹出窗口{
位置：绝对位置；
最小宽度：100px；
最小高度：100px；
填充：20px；
边界半径：12px；
背景：#000；
颜色：#fff；
可见性：隐藏；
}
.popup:before、.popup:：before、.popup:after、.popup:：after{
内容：“；
宽度：0px；
高度：0px；
显示：块；
位置：绝对位置；
}
var popup=document.getElementsByClassName（'popup'）[0]；
popup.innerHTML='；
console.log（popup.offsetHeight）；

您可以获得元素的边框，即顶部、底部、右侧和左侧，然后减去它们以获得宽度和高度。这说明页面修改后的实际像素：

var width  = [element].getBoundingClientRect().right - [element].getBoundingClientRect().left ;
var height = [element].getBoundingClientRect().bottom - [element].getBoundingClientRect().top ;

---

在脚本中更改此选项。请注意，我在innerHTML中添加了更多文本

<script>
  var popup = document.getElementsByClassName('popup')[0];
  console.log("Before: "+popup.offsetHeight);
  popup.innerHTML = 'любой текст от 3 до NNN строк<br><br>moretext';
  console.log("After: "+popup.offsetHeight);
</script>

控制台中的输出为：

Before: 40
After: 180

---

下面是一个有效的示例（打开控制台查看输出）：

我尝试过，但得到了相同的结果。首先，大小大于一段时间后的大小。当从右到左或从下到上进行宽度或高度计算时，请记住添加1。不，在我的情况下，我只有207，例如（对于长文本），然后一段时间后，我得到137。我有一个DIV，而不是input或textarea。在这种情况下，“更改事件”不起作用。请发布更多代码和/或解释为什么需要这些代码？也许有另一种方法可以实现你想要做的事情。我需要让它达到重新定位的高度。我添加了代码，但由于某些原因，它工作正常。我不知道（我编辑了我的第一条消息，并添加了一个示例：你是认真的吗？document.getElementsByClassName（'popup'）返回一个元素数组。我正在更改元素的内容，而不是元素本身。

Before: 40
After: 180