jquery - 使用 jquery 和动态内容检测高度

Question

我有一个 div 必须垂直对齐，div 中的文本是动态生成的，所以我需要使用生成的内容获取 div 大小，然后将其设置为其他 div，以便它可以垂直对齐。

这是我的标记

<?php foreach ($necesidades as $necesidad): ?>
    <div class="guia-wrap">
         <div class="tit">
              <div><?php echo $necesidad->getTituloByPais($pais) ?></div>
         </div>
         <div class="desa">
              <div><?php echo html_entity_decode($necesidad->getDescripcion()) ?></div>
         </div>

         <script>
             $(document).ready(function(){
                 altura = $('.desa').height();
                 $(".tit").css("height", altura);
                 $(".tab_content").hide();
             });
         </script> 
    </div>
<?php endforeach; ?>

因此，我正在获取 .desa 的高度并将其设置为 .tit。但是由于生成了几个 .guia-wraps，我不知道如何获取每个 .desa 的高度并将它们设置为自己的 .tit

这是CSS

.tit { 
    display: table; 
    float: left; 
    width: 213px; 
    border-right:1px solid #dedede; 
    height: 100%; 
    font-family: arial;
    font-size: 14px; 
    color: #666666; 
    background: #f6f6f6;
 }
.tit div {
    display: table-cell; 
    vertical-align: middle; 
    padding: 15px;
}
.desa { 
    display: table;
    float: right; 
    width: 476px; 
    font-family: arial; 
    font-size: 12px; 
    height: 100%; 
    color: #959595; 
}
.desa div {
    display: table-cell; 
    vertical-align: middle; 
    padding: 15px;
}

希望它足够清楚。谢谢。

Answer 1

使用 Jquery，您可以使用 each() 做一些事情像这样:

$(document).ready(function(){
   $('.guia-wrap').each(function(){
      var h = $('.desa',this).css('height');
      $('.tit', this).css('height',h)
   })
})