html元素如何隐藏后刷新页面不再显示 提示框bootstrap？

Question

html元素如何隐藏后刷新页面不再显示：
以下是源码，谢谢！
cookie啥的缓存都行阿救命
<div class="alert alert-warning">
<a href="#" class="close" data-dismiss="alert">×</a>
<strong><i class="bx bx-shield-quarter bx-tada"></i>点击前往<a href="/law">查看协议</a></strong>
</div>

Answer 1

可以使用localStorage。
当隐藏的时候设置缓存，如：localStorage.setItem('isHideAgree',"1");

页面初始化时获取指定缓存，判断是否隐藏，是执行隐藏代码。简单代码如下，具体可根据自己情况扩展

Answer 2

问题的关键是保存一个状态标志。
最简单的方法把标志数据存在客户端，保存数据可以用 cookie 、localStorage、IndexDB。页面加载的时候JS读取一下， 更具状态标志来控制显示与否。
这么做的缺点是当用户换了个浏览器或者手动清除了本地的数据后状态标志也就没了又会显示出来。要解决这个问题可以把状态标志给存到服务器上， 当用户点关闭的时候发个ajax请求把用户标识和状态标志给发送到服务器， 由服务器来记录这个标志。用户刷新页面的时候服务器吐页面数据可以更具状态标志和用户标识来决定是否输出某段html或JS， 或者在页面onload的时候通过ajax向服务器查询当前用户的状态标识更具服务器返回来决定提示框是否显示出来。

Answer 3

不知道你用的是哪个版本的bootstrap，如果是单纯的bootstrap，直接加js控制是否为首次加载页面就行了，Less与sass版本的要修改相应的控制语句