jquery - .each() 在 div 元素中，找到一个子元素，根据其内容设置高度(高级？)

Question

我需要找到每一行 div，并根据内容最多的 h2 确定该行中 h2 的高度。

我正在尝试循环遍历一个包含div(子)的div(主)，在该div中我得到了部分(子)并且在该部分中我得到了h2。

现在，根据 h2 中内容最多的内容，我使用 jQuery 库设置其他 h2 的高度:http://www.tomdeater.com/jquery/equalize_columns/

我了解一些 jQuery，但还不太了解如何做到这一点。

最好检查 jsfiddle 链接 http://jsfiddle.net/CbNRH/13/ 。我还没写完剧本。首先，我尝试找到 h2 元素并写出它的值。然后我想我会继续前进，但这比我对 jQuery 的了解更复杂。如有任何帮助，我们将不胜感激。

<div id="col-main">
    <div class="contain">
        <section><div><h2>depending on my content i use .equalizeCols()</h2></div></section>
        <section><div><h2>2</h2></div></section>
    </div>
    <div class="contain">
        <section><div><h2>depending on my content i use .equalizeCols()</h2></div></section>
        <section><div><h2>3</h2></div></section>
    </div>
    <div class="contain">
        <section><div><h2>depending on my content i use .equalizeCols()</h2></div></section>
        <section><div><h2>6</h2></div></section>
    </div>
</div>
<div id="write-out"></div>

$('#col-main > div').each(function () {
      var $this = $(this);
      $('#write-out').text($this.child('section').find('h2').val());
});

div.contain { margin-bottom: 10px; background-color: #dddddd; }
div.contain section { padding: 10px; }
div.contain section div h2 { font-size: 12px; width: 80px; background-color: red; }

div#write-out { font-size: 16px; padding: 10px; background-color: #ffcc00; }

Answer 1

我采用了 k.honsali 代码并进行了一些简化，所以我的建议如下:

$('#col-main > div').each(function () {
    var tmpHeight = 0;
    $(this).find("h2").each(function() {
        tmpHeight = $(this).height() > tmpHeight ? $(this).height() : tmpHeight;
    });
    $(this).find("h2").height(tmpHeight);
});