jquery判断元素是否在可视区域范围内

已经有类似的文章了，但是总感觉哪里不对！
所以此文仅作备忘用，如果能帮助你更好的理解就更好了！

目标元素：#item

var item = $('#item');

当页面滚动时，元素随页面滚动，该元素距离顶部的距离

var itemOffsetTop = $("#item").offset().top;

获取item的高度（我的需求需要包含外边距）

var itemOuterHeight = $("#item").outerHeight(true); //这个方法可以传递一个参数true, 如果传递表示需要求出的高度含有外边距, 否则不含有. 具体视需求而定.

获取页面滚动的距离

var winScrollHeight = $(window).scrollTop();

浏览器可见区域的高度:

var winHeight = $(window).height();

那应该如何确定元素在可见区域内呢？

实现代码：

if(!(winScrollTop > sectionThreeOffsetTop+sectionThreeOuterHeight) && !(winScrollTop < sectionThreeOffsetTop-winHeight)) {
                console.log("出现了")
            } else {
                console.log("消失了")
            }