jQuery css('padding') - Firefox 的问题答案

【问题标题】：jQuery css('padding') - Issue with FirefoxjQuery css('padding') - Firefox 的问题
【发布时间】：2013-03-07 23:52:42
【问题描述】：

当您尝试获取元素的 padding 时，似乎 Firefox（至少 v19.0.2）与 jQuery css() 函数存在问题。

当我使用.css('padding-left') 时没有问题，但最好写一行而不是 4 行，尤其是像这样的简单功能。

这是一个显示我的问题的示例，请比较 Chrome/Firefox 的行为：

$('#log').append(
    'padding : '+        $('#sample').css('padding')+'\n'+
    'padding-top : '+    $('#sample').css('padding-top')+'\n'+
    'padding-bottom : '+ $('#sample').css('padding-bottom')+'\n'+
    'padding-left : '+   $('#sample').css('padding-left')+'\n'+
    'padding-right : '+  $('#sample').css('padding-right')+'\n'
);

#sample {
    border: 1px solid black;
    padding: 8px;
    margin: 10px;
}
#log {
    padding: 8px;
    margin: 10px;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<div id="sample">Lorem ipsum</div>
<textarea id="log" rows="10" cols="50"></textarea>

我错过了什么吗？或者是否有一种解决方法可以在不调用 4 个函数的情况下检索元素的 padding？

谢谢。

【问题讨论】：

标签： jquery css firefox padding

【解决方案1】：

见bug #13421（虽然这实际上不是一个错误）。

css() 的文档说：

简写 CSS 属性（例如 margin、background、border）不是支持的。例如，如果要检索渲染的边距，使用：$(elem).css('marginTop') 和 $(elem).css('marginRight')，等等开。

padding 就是这样一个属性，所以你确实必须使用paddingLeft、paddingRight 等。

【讨论】：