Javascript 为下一次加载更改选定导航的背景

我正在为我的网站设计一个垂直菜单，并尝试在单击导航项和使用jQuery加载页面时更改导航项的背景颜色。它会更改背景，直到页面未加载。加载页面时，背景更改不存在。我跟在后面。我的设计类似于左导航菜单，当单击某个项目时，它会保留该li/a/导航项目的背景更改。我如何正确地编写代码以保持该特定链接/a导航项的背景更改，以便下次加载？这是我的密码

$（'.widget\u nav\u plus\u widget a'）。单击（函数（e）{
$（'.widget\u nav\u plus\u widget a'）.removeClass（'current\u page\u item'）；
$（this.addClass（'current_page_item'）；
});
.widget\u nav\u plus\u widget{
宽度：100%；
高度：30公分；
边框：1px实心#ccc；
填充：0；
溢出：滚动；
溢出x：隐藏；
}
.widget_nav_plus_widget ul li{
边框顶部：1px实心#ccc；
背景色：#236870；
左边距：-30px；
右边距：-30px；
线高：1.7em；
}
.widget_nav_plus_widget ul li a{
颜色：白色；
文字装饰：无；
显示：块；
} 
.widget_nav_plus_widget ul li a:悬停{
颜色：白色；
显示：块；
文本缩进：1em；
背景色：#0034a1；
}
.widget_nav_plus_widget ul ul li{
文本缩进：1em；
背景色：白色；
颜色：黑色；
利润上限：-10px；
}
.widget_nav_plus_widget ul li a{
颜色：黑色；
文字装饰：无；
显示：块；
} 
.widget_nav_plus_widget ul ul li a:悬停{
颜色：白色；
显示：块；
文本缩进：1em；
背景色：#4ba668；
}
.widget_nav_plus_widget ul li{
文本缩进：3em；
}   
.widget_nav_plus_widget ul li:悬停{
文本缩进：3em；
}
.widget_nav_plus_widget ul li a:悬停{
颜色：白色；
显示：块；
文本缩进：3em；
背景色：#4ba668；
}
.当前页面\项目{
背景色：#4ba668；
颜色：白色；
显示：块；
}
























您可以使用Localstorage，我在您的JS代码中做了一些更改

const currentPage = localStorage.getItem("currentPage");
$(`a[href='${currentPage}']`).addClass('current_page_item');

$('.widget_nav_plus_widget a').click(function(e) {
    $('.widget_nav_plus_widget a').removeClass('current_page_item');
    $(this).addClass('current_page_item');
    localStorage.setItem("currentPage", $(this).attr('href'));

});

欢迎来到堆栈溢出。这个问题有点不清楚。我不知道你所说的“加载页面时，背景更改不存在”是什么意思。你是说当你导航到另一个back然后back，页面重新加载时？你以为会发生什么？请记住，除非您将脚本保存到某个地方，否则您对脚本所做的更改将不会被保留。听起来您可能需要将状态存储在变量、数据库或某种类型中。如果您想在客户端执行此操作，本地存储可能就是您想要的。@Twisty谢谢您的回复。是的，上面的go代码是导航代码。当用户点击C++循环（让我们说）时，当负载时，我想要这个导航的背景。同样，如果他导航到另一个页面，如C++指针，那么导航的背景应该改变，C++循环应该回到原来的颜色，这样用户可以在哪个页面导航页面是他。