將列的高度設置爲每個元素的另一個

Question

不幸的是，我需要使用JS將col-1（靜態）設置爲與文本容器col-2（dyanmic）相同的高度。

我已經試過：

$(function() { 

    var article = $('section.inner-services article'); 

    $(article).each(function(index) { 

     var textColHeight = $('section.inner-services article .col-2').height(); 
     var figureCol = $('section.inner-services article .col-1'); 
     $(figureCol).css('height', textColHeight); 
     console.log(index); 

    }); 

}); 

我的HTML標記（簡體）：

<section class="inner-services"> 
    <article> 
     <col-1> 
     <col-2> 
    </article> 
</section> 

這並不如預期通過每個article環和col-1高度設置爲col-2高度。

如果可能，請簡要說明我出錯的地方。

Answer 1

起初，一旦你已經創建了jQuery對象，沒有必要再次創建它，所以沒有必要$(article)。

在第二個裏面each你可以參考當前元素爲this。

正確的代碼可能是這樣的：

$(function() { 

    $('section.inner-services article').each(function(index) { 

     var textColHeight = $(this).find('.col-2').height(); 
     var figureCol = $(this).find('.col-1').height(textColHeight); 

     console.log(index); 

    }); 

}); 

Answer 2

你需要尋找col-2和col-1下每article

$(function() { 

    var article = $('section.inner-services article'); 

    $(article).each(function(index) { 

     var textColHeight = $(this).children('.col-2').height(); 
     var figureCol = $(this).children('.col-1'); 
     $(figureCol).css('height', textColHeight); 
     console.log(index); 

    }); 

});