javascript - 如果有 3 个或更多元素，则可滚动的 div

Question

我有一个 block ，其用户地址 (div) 的数量可以是零或一个或更多。我希望如果 div 的数量是 3 或更多，那么 block 是可滚动的并且 block 的最大高度等于3个地址的高度(3格) 或者(最大高度myDIV=地址-详情1的高度+地址-详情2的高度+地址-详情3的高度)

.但我不知道哪里出了问题？

https://jsfiddle.net/tp8hc72k/3/

var nodelist = document.getElementsByClassName("address-details").length;
if (nodelist >= 3) {
  maxhght = 0
  for (i = 0; i < 3; i++) {
    var elmnt = document.getElementById('myDIV').children[i];
    maxhght += elmnt.offsetHeight;
  }

  //alert(maxhght);
  document.getElementById("myDIV").setAttribute(
    "style", "maxHeight:maxhght;overflow: auto;width:100%");
}

.address-details {
  border: 1px solid black;
  margin: 0.5rem
}

#myDIV {
  border: 2px solid red;
}

<div id="myDIV">
  <div class="address-details">The 1 address element in the document.</div>
  <div class="address-details">The 2 address element in the document.</div>
  <div class="address-details">The 3 address element in the document.</div>
  <div class="address-details">The 3 address element in the document.</div>
  <div class="address-details">The 3 address element in the document.</div>
  <div class="address-details">The 3 address element in the document.</div>
</div>

<button onclick="myFunction()">Try it</button>

Answer 1

用这一行替换最后一行:

document.getElementById("myDIV").setAttribute(
"style", "max-height:"+maxhght+"px;overflow: auto;width:100%");