獲得渲染的DIV高度

Question

我在使用布局工具來調整div的大小時遇到​​一個問題。 這些div的標題范圍設置為bottom : 0 。 在縮短的div上，這些效果很好，但是在加長的DIV上，它們浮動在div底部上方。

我嘗試了各種CSS方法使跨度固定在底部，但是似乎一旦渲染了這種方式，然后使用freewall（布局腳本），就不會將跨度向下推。

我試圖通過各種方法來獲取父級DIV的高度。 當我控制台記錄div時，我可以在element.style中看到它的渲染高度（height：222.4px）； 但是，當我嘗試訪問樣式時，它僅返回css應用的背景圖像，而不返回渲染的高度。 通過jquery .height（）進行的任何嘗試只會返回不正確的CSS高度（200px）。

有什么想法如何確保在調整布局大小后元素保持在底部，或者如何訪問渲染的高度，以便我可以以編程方式將其重新粘貼在底部？

這是CSS

.guideScene
{
    height :            200px;
    width :             200px;
    min-width :         190px;
    background-size:    cover; 
    background-repeat:  no-repeat;
    background-position: center;
    position:           absolute;

}


@media all and (max-width: 768px) {
    .guideScene {
        height :        100px;
    }
}

.guideScene span
{
    font-family:        'Lato', sans-serif;
    font-color :        #000;
    font-weight:        700;
    font-size:          14px;
    line-height:        100%;
    min-height:         14px;
    background:         #fff;
    padding:            4px 10px 4px 10px;
    bottom:             0px;
    width:              100%;
    position:           absolute;

}

在這里，您可以彈出popNoodles：

        console.log( $(this.parentNode).outerHeight(true) );
        console.log( $(this.parentNode).height() );

或console.log( $(this.parentNode).attr('style')返回背景

        console.log(this.parentElement) gives me the data

我正在嘗試訪問的是此屬性！

Answer 1

.height()僅給出元素的高度

.innerHeight()給出元素的高度加上頂部/底部填充

.outerHeight(true)可能是您要查找的內容，因為它提供元素的高度，頂部/底部填充和邊框，如果設置為true，它將添加邊距