Jquery .position 为 null 转换为 0答案

【问题标题】：Jquery .position is null convert to 0Jquery .position 为 null 转换为 0
【发布时间】：2014-07-08 21:59:37
【问题描述】：

我已经在网上搜索了，还没有找到这个问题的答案..

我有一个 jquery .position 语句可以更改元素的 css，但如果位置返回 null，则会失败。如何将 null 值转换为 0 以添加到位置？

    var menu = $('.menu');
    var menuposition = menu.offset();
        $('.other').css('top', menuposition.top + 100);

如果 menuposition 的值为null，则语句失败.. 感谢您的想法！

【问题讨论】：

【解决方案1】：

如何为菜单位置设置默认值？就这样……

var menu = $('.menu');
var menuposition = menu.offset() || {top:0};
    $('.other').css('top', menuposition.top + 100);

【讨论】：

【解决方案2】：

这是使用返回 null 的 API 的缺点之一。此处可以使用Null Object 模式来简化 API，使客户端免于处理空值。

".offset() 返回一个包含 top 和 left 属性的对象"

因此，您可以执行以下操作：

var menuOffset = menu.offset() || { top: 0, left: 0 },
    menuTop = menuOffset.top + 100;

$('.other').css('top', menuTop + 'px');

【讨论】：

@Nit 它更高效，因为您保存了一个属性查找、一个函数调用以及该函数可能正在执行的任何处理（这可能很昂贵，但我还没有查看实现）。跨度>
对我来说听起来像是过早的优化。
@plalx 它仍然可以使用一个调用一个var -- var menuposition = menu.offset() || { top: 0, left: 0 };
好的，谢谢，但唯一潜在的问题是菜单会根据滚动位置移动（即响应式导航栏，开始时向下 20 像素，滚动到顶部）。我的意思是，如果它位于顶部，我将无法访问该值..
@NickB 你可以从menuTop中减去$(window).scrollTop()。