jquery - 在 jQuery CSS 属性行中使用变量

Question

我试图做的是计算浏览器高度，将该数字减少约 20%，然后将该数字分配给元素的高度。问题是元素位于可滚动的 div 中，因此仅分配height: 80%不起作用，因为我想要浏览器高度而不是父 div 高度。不幸的是，另一个问题是我必须使用!important语法来强制它。

这是我到目前为止所拥有的：

var browserHeight = jQuery(window).height();
var desiredHeight = browserHeight * 0.8;
jQuery('##myID .myClass').attr('style', 'height: 100px !important');

我只需要弄清楚如何替换100px为desiredHeight，而不会丢失!important。

如果你能帮助我，我一定会很感激的！即使您有不同的（也许更好的）方法。:)

Answer 1

您可以将字符串与变量连接起来：

$('#myID .myClass').attr('style', 'height: ' + Math.round(desiredHeight) + 'px !important');

注意：我从选择器中删除了多余的磅符号，这会导致异常。此外，您不需要重要，因为这是一种内联样式，并且会覆盖元素的所有 css 规则。我会将其切换为使用 css 方法：

$('#myID .myClass').css('height', desiredHeight);

Answer 2

var browserHeight = $(window).height();
var desiredHeight = browserHeight * 0.8;
jQuery('##myID .myClass').attr('style', 'height: '+ desiredHeight +'px !important');

Answer 3

这应该工作

var browserHeight = jQuery(window).height();
var desiredHeight = browserHeight * 0.8;
jQuery('##myID .myClass').attr('style', 'height: '+desiredHeight+'px !important');