javascript - 得到呈现的DIV高度

Question

我在使用调整大量 div 大小的布局工具时遇到问题。这些 div 有一个标题范围，设置为 bottom : 0。在缩短的 div 上，这些很好，但是在加长的 DIV 上，这些 float 在 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，它还会添加边距