如何在用户会话中维持CSS修改？页面刷新后隐藏区块复原

要在页面刷新后维持区块的隐藏状态，你可以利用浏览器的localStorage或sessionStorage存储状态标记，页面加载时读取标记并执行对应操作：

1. 修改点击事件逻辑 #

点击按钮时，除了隐藏区块，还要将状态存入存储：

jQuery('.ub-button-block-main').on('click',function() {
    jQuery('div#myDiv').css('display','none');  
    // 用localStorage持久化保存状态（关闭浏览器再打开仍保留）
    localStorage.setItem('myDivHidden', 'true');
    // 若仅需当前会话保留，改用sessionStorage：
    // sessionStorage.setItem('myDivHidden', 'true');
})

2. 页面加载时恢复状态 #

DOM加载完成后，读取存储的状态并判断是否隐藏区块：

jQuery(document).ready(function() {
    const isHidden = localStorage.getItem('myDivHidden');
    if (isHidden === 'true') {
        jQuery('div#myDiv').css('display','none');
    }
})

补充功能（可选） #

如果需要恢复区块显示，可添加按钮并清除存储标记：

jQuery('.show-myDiv-btn').on('click',function() {
    jQuery('div#myDiv').css('display','block');
    localStorage.removeItem('myDivHidden');
})

内容的提问来源于stack exchange，提问作者Larry