Javascript 在刷新页面时记住类名

我试过几种不同的方法来做这件事，但都做不好

scroll上的脚本在每个div进入视口时都会添加一个“.prod_uuuview”类，因此我希望浏览器记住哪些div有“.prod_uview”在重新加载页面时，我尝试了会话存储，但它并不完全存在

$（窗口）.on（'resize load scroll'，function（）{
$（'.prod\u item'）。每个（函数（）{
if（$（this.prodInViewport（））{
$（this.addClass（'prod_u_已查看'）；
}
});
var numItems=$（'.prod__item'）.length；
var totalNumItems=$（'.prod_u'）。长度；
var prodCountCheck=$（'.prod__count__container'）；
var positionY=$（this.scrollTop（）；
var pageHeight=$（this.height（）；
var scrollHeight=$（'.prod__包装器'）.height（）；
变量scrollPercent=（位置Y/（滚动高度-页面高度））*100；
var prodCountElement=$（'.prod__count__container'）.outerHeight（）；
if（prodCountCheck.length==1）{
$（“.prod\u count\u content”）
.html（'You'；已经看到'+totalNumItems+'的'+numItems+'prods'）；
$（'.prod\u load\u bar'）.css({
“top”：prodCountElement，
“宽度”：滚动百分比+“%”
});
}
});
$.fn.prodInViewport=函数（）{
var elementTop=$（this）.offset（）.top；
var elementBottom=elementTop+$（this.outerHeight（）；
var viewportTop=$（window.scrollTop（）；
var viewportBottom=viewportTop+$（window）.height（）；
返回elementBottom>viewportTop&&elementTop

html{
框大小：边框框；
字体大小：62.5%；
-webkit溢出滚动：触摸；
}
*,
*：之前，
*：之后{
框大小：继承；
}
身体{
背景：#fff；
颜色：#333；
字体系列：“蒙特塞拉特”，无衬线；
字体大小：1.6rem；
线高：1.5；
保证金：0；
}
a{
颜色：#333；
文本装饰：无
}
.标题内容{
字号：18px；
线高：1.8；
左边距：自动；
右边距：自动；
最大宽度：500px；
宽度：100%；
}
.prod__包装{
左边距：自动；
右边距：自动；
边缘顶部：60像素；
最大宽度：500px；
宽度：100%；
}
.prod___容器{
显示器：flex；
柔性包装：包装；
左边距：-20px；
利润上限：-60px；
左侧填充：20px；
右边填充：20px；
}
.prod\u项目{
弹性基准：50%；
最大宽度：50%；
左侧填充：20px；
填充顶部：60px；
}
.prod_u_项目——img{
身高：0；
垫底：100%；
位置：相对位置；
}
.prod_u_项目——img img{
左：50%；
最大高度：100%；
最大宽度：100%；
位置：绝对位置；
最高：50%；
转换：翻译（-50%，-50%）；
宽度：自动；
}
.产品名称{
字号：700；
线高：1.2；
边缘顶部：10px；
}
.产品价格{
边缘顶部：10px；
}
.prod\u计数\u包装器{
左边距：自动；
右边距：自动；
边缘顶端：40px；
最大宽度：500px；
位置：粘性；
排名：0；
z指数：1；
}
.prod\u count\u容器{
对齐项目：居中；
背景：深蓝色；
颜色：白色；
显示器：flex；
字体大小：20px；
高度：60px；
左侧填充：20px；
右边填充：20px；
证明内容：中心；
文本对齐：居中；
宽度：100%；
}
.prod\u计数\u内容{
位置：相对位置；
顶部：-1px；
}
.prod\uuuu加载条{
背景：道奇蓝；
高度：6px；
左：0；
最大宽度：100%；
位置：绝对位置；
排名：0；
}
.随机内容{
左侧填充：20px；
右边填充：20px；
左边距：自动；
右边距：自动；
边缘顶部：60像素；
最大宽度：500px；
宽度：100%；
}

我的英雄两个英雄蓝光
£14.99
我的英雄两个英雄蓝光
£14.99
我的英雄两个英雄蓝光
£14.99

我想我已经按照你的要求完成了。 在scroll函数中，我将视图中元素的索引添加到数组中，并将该数组保存到会话存储器中。 然后，当页面加载时，我得到已查看对象的索引数组，并将类添加到该元素中

这是一个可行的办法，因为由于安全原因，堆栈溢出不允许您访问会话存储。

$.fn.prodInViewport=function（）{
var elementTop=$（this）.offset（）.top；
var elementBottom=elementTop+$（this.outerHeight（）；
var viewportTop=$（window.scrollTop（）；
var viewportBottom=viewportTop+$（window）.height（）；
返回elementBottom>viewportTop&&elementTop'+totalNumItems+'的'+numItems+'+