javascript - YUI 中的 jQuery outerHeight() 等价物是什么

Question

在 jQuery 中，我可以很容易地通过使用 outerHeight() 获取包含填充、边框和可选边距的元素的当前计算高度。 ...

// returns height of element + border + padding + margin
$('.my-element').outerHeight(true);

我如何在 YUI 中执行此操作？我目前使用的是2.8.1 版。

类似于this question ，我总能做到getComputedStyle()高度、边框、填充和边距，但这是大量的体力劳动，包括解析返回值和获取所需的正确值以及自己进行数学计算。

在 YUI 中是否有一些与 jQuery 的 outerHeight() 等效的函数可以为我完成所有这些工作？

解决方案

由于找不到等效的 jQuery outerheight()，我最终编写了自己的解决方案。我已将解决方案发布为 an answer here .

Answer 1

在 YUI 中没有内置的方法来获取带有边距的元素的外部宽度。就像 @jshirley 提到的那样，有 offsetWidth，但它没有考虑边距。但是，您可以创建一个非常容易地添加边距的函数:

Y.Node.ATTRS.outerHeight = {
  getter: function () {
    return this.get('offsetHeight') + 
           parseFloat(this.getComputedStyle('marginTop')) + 
           parseFloat(this.getComputedStyle('marginBottom'));
  }
};

Y.Node.ATTRS.outerWidth = {
  getter: function () {
    return this.get('offsetWidth') +
           parseFloat(this.getComputedStyle('marginLeft')) +
           parseFloat(this.getComputedStyle('marginRight'));
  }
};

然后您可以通过执行 Y.one(selector).get('outerWidth') 获取外部宽度。这是一个基于@jshirley 代码的示例:http://jsbin.com/aretab/4/ .

请记住，尺寸通常是浏览器中错误的来源，并且这没有考虑 jQuery 试图捕获的一些东西(即:文档的尺寸)(参见 https://github.com/jquery/jquery/blob/master/src/dimensions.js)。