Question

我有一个包含2列的行的表。一列包含图像，另一列包含文本。图像是我调整大小的大图像（意思是，它们从容器中取出它们的高度）。我需要行从textCell获取其高度。由于文本的数量在一行中是可变的，我无法指定显式高度。但是考虑到图像大于文本的大小，行从imageCell而不是textCell获取其高度。如何获取行和imageCell以获取textCell的高度？

<table  border="0" cellspacing="0" cellpadding="0" id="articleTable">
    <tr id="row-1" class="articleRow light" >
        <td class="imageCell" id="image-cell-1">
            <img src="images/Support/CFD.png" alt="" class=""/>
            <img src="images/Support/CFD3.png" alt=""  class="" />
        </td>
        <td class="textCell" id="text-cell-1" >
            <div class="articleTextWrapper">
                TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT 
            </div>
        </td>

    </tr>
    <tr id="row-2" class="articleRow dark" style="">
        <td class="textCell" id="text-cell-2" >
            <div class="articleTextWrapper">
                TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT 
                TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT 
                TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT 
                TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT 
                TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT TEXT 
            </div>
        </td>
        <td class="imageCell"  id="image-cell-2">
            <img src="images/Support/TM2.png" alt=""   class="" />
            <img src="images/Support/TM1.png" alt=""   class=""/>
        </td>
    </tr>

Answer 1

也许像这样的一些Javascript方法：

var txts = document.getElementsByClassName("textCell");
for(var i=0; i<txts.length; i++) {
    var h = txts[i].getElementsByClassName("articleTextWrapper")[0].offsetHeight;
    txts[i].parentNode.style.height = h + "px";
}

这将相对于单元格内文本的高度设置固定高度<tr>，使您能够将图像设置为全高。

控制表格行高度，从中获取文本的高度

1 个答案: