Question

$('#my_div').height('50%')会设置高度但是如何以百分比的形式检索div的当前高度？

Answer 1

您可以使用.height()，它只返回数字（即没有单位符号）。完美的百分比，当然不需要单位。来自文档：

.height()方法当元素的时候推荐高度需要用在一个数学计算。

所以你可以尝试这样的事情：

var height_pct = Math.round( 
    $('#my_div').height() / 
    $('#my_div').parent().height() * 100
    );

Answer 2

你可以用px转换获取高度并将它们转换为百分比

答案 2 :(得分：0)

太简单了 $（ “＃eleid”）[0] .style.width

答案 3 :(得分：0)

尝试隐藏要获取的元素的百分比值。

<div id="a" style ="height: 300px; background: green; display: none;">
    a
    <div id="b" style ="height: 10%; background: blueviolet;">
        b
    </div>
    <div id="c" style ="height: 20%; background: cornflowerblue;">                        
        c
    </div>        
</div>
<script>
$(document).ready(function(){
    // height outside of event     
    $("#a").append($("#a").height());
    $("#b").append($("#b").height());
    $("#c").append($("#c").height());

    // height inside of event               
    $("*").click(function(){                
        $("#a").css("display", "block");
        $("#a").append($("#a").height());
        $("#b").append($("#b").height());
        $("#c").append($("#c").height());
    })
}) 
</script>

请注意，事件函数中的值不同。

附加说明：

.height（）报告的值在以下情况下不能保证准确元素或其父元素被隐藏。要获得准确的值，请确保在使用.height（）之前，该元素是可见的。 jQuery将尝试暂时显示然后重新隐藏元素以测量其尺寸，但这是不可靠的，并且（即使准确）也可以严重影响页面性能。这个秀与隐藏将来的jQuery版本中可能会删除测量功能。

来源： jQuery height()

答案 4 :(得分：0)

基于另一个answer，对于固定的div（例如面板），这对我有用：

    var h = Math.round(
        $('#my_div').height() /
        $(window).height() * 100
    );

Answer 3