如何使所有线条的高度相等？

<style>
   .container {
      display: flex;
   }

   .item {
      flex: 1;
      align-items: center;
      justify-content: center;
   }
</style>

<div class="container">
   <div class="item">内容1</div>
   <div class="item">内容2</div>
   <div class="item">内容3</div>
</div>

<script>
   window.onload = function() {
      var lines = document.getElementsByClassName('line');
      var maxHeight = 0;
      
      for (var i = 0; i < lines.length; i++) {
         maxHeight = Math.max(maxHeight, lines[i].clientHeight);
      }

      for (var i = 0; i < lines.length; i++) {
         lines[i].style.height = maxHeight + 'px';
      }
   };
</script>

<div class="line">线条1</div>
<div class="line">线条2</div>
<div class="line">线条3</div>