LocalStorage在部分页面无法设置项的技术求助

我在本地MAMP服务器上运行搭载WooCommerce的WordPress站点，域名是https://dev.mysite.io。尝试通过LocalStorage存储过期时间，控制header.php中全局显示的div的显示与隐藏。目前在首页能正常设置LocalStorage项，但在https://dev.mysite.io/test-page页面无法设置，而https://dev.mysite.io/test-page/test页面又能正常设置。所有页面都是同源（协议、端口、域名一致），理论上LocalStorage应该在该域名下所有页面可用。

使用的JS代码如下：

$( function() {
    const storageKey = 'show_content';
    const expiry = 7 * 24 * 60 * 60 * 1000; // 换算为7天的毫秒数
    const expiryDate = new Date().getTime() + expiry;

    // 检查是否应该显示内容
    const showContent = localStorage.getItem( storageKey );
    const timeNow = new Date().getTime();

    // 一周后重新显示内容
    if ( ! showContent || timeNow > showContent ) {
        $( '.content' ).show();
        localStorage.removeItem( storageKey );
    }

    // 点击关闭按钮时设置LocalStorage并隐藏内容
    $( '.content__close' ).on('click', () => {
        localStorage.setItem( storageKey, expiryDate );
        $( '.content' ).hide();
    } );
} );

• 确认jQuery是否加载：在test-page的浏览器控制台输入$，如果返回ReferenceError，说明该页面未加载jQuery。需要确保WordPress主题/插件在你的自定义脚本之前正确加载了jQuery，可通过wp_enqueue_script依赖项设置强制加载。
• 检查目标元素是否存在：在控制台执行$( '.content__close' ).length，若结果为0，说明该页面中没有这个按钮元素。可能是页面布局差异导致div未渲染，需要检查header.php的条件渲染逻辑，确保.content__close在所有页面都存在。
• 测试LocalStorage写入权限：手动在控制台执行localStorage.setItem('test_key', 'test_val')，如果无法写入，可能是浏览器隐私插件阻止了该页面的存储操作，尝试禁用插件后重试。
• 改用事件委托绑定点击事件：如果.content__close是动态生成的元素，直接绑定点击事件会失效，换成事件委托写法：

  $(document).on('click', '.content__close', () => {
      localStorage.setItem( storageKey, expiryDate );
      $( '.content' ).hide();
  });
  

• 清空WordPress缓存：若使用了缓存插件（如WP Rocket），可能test-page仍加载旧代码。清空缓存后刷新页面，或在脚本注册时添加时间戳作为版本号强制更新：

  wp_enqueue_script( 'custom-script', get_template_directory_uri() . '/js/custom.js', array('jquery'), time(), true );
  

内容的提问来源于stack exchange，提问作者tsvetko.krastev