纯JavaScript函数类似于jQuery.offset()？

Question

我在俄罗斯社交网络Odnoklassniki.ru上有一个小的iframe应用程序并调整其iframe的大小我使用以下调用:

<div id="fb-root"></div> 
<script src="http://api.odnoklassniki.ru/js/fapi.js" 
type="text/javascript"></script> 
<script type="text/javascript"> 
FAPI.init("http://api.odnoklassniki.ru/", "XXX_YYY",
function() {
        alert("clientHeight " + document.getElementById("fb-root").clientHeight);
        alert("offsetHeight " + document.getElementById("fb-root").offsetHeight);
        FAPI.UI.setWindowSize(720, 1200);
}, function(error){
        alert("API initialization failed");
});
</script> 
</body> 
</html>

即iframe-height目前硬编码为1200.

它工作正常,但我想改用#fb-root元素的高度/位置.

有没有人有一个想法,这里可以使用哪个JavaScript或CSS函数 - 如果我不想只为一个$(#fb-root).offset()调用包含jQuery？

我也查看了他们的图书馆http://api.odnoklassniki.ru//js/fapi.js,但它不包括这样的功能.

UPDATE

我在上面的源代码中添加了两个警报调用,但它们只打印"XXX 0".

UPDATE

以下代码似乎适用于我的Google Chrome和Mozilla Firefox中的iframe应用程序,无论
我添加了多少用于测试它.但是使用Internet Explorer无法调整窗口大小并且警报显示top = 1107而不是Google Chrome中的top = 1157,因此底部的html表格被截断:

clientHeight 0
offsetHeight 0

谢谢!亚历克斯

Answer 1

查看jquery中的代码，偏移量是这样计算的：

function getOffset(element)
{
    if (!element.getClientRects().length)
    {
      return { top: 0, left: 0 };
    }

    let rect = element.getBoundingClientRect();
    let win = element.ownerDocument.defaultView;
    return (
    {
      top: rect.top + win.pageYOffset,
      left: rect.left + win.pageXOffset
    });   
}

Answer 2

怪异模式有一个JavaScript教程/功能,演示如何找到一个元素的坐标位置

获得坐标后,可以使用iframe的offsetHeight属性读取其高度.