在页面重新加载后保持 <div> 显示

Question

问题很简单，就是找不到解决办法。我只是通过单击按钮来显示文本，但是当重新加载页面时，我希望文本仍然显示而无需再次单击按钮。我的代码如下：

<script
  src="https://code.jquery.com/jquery-3.4.1.min.js"
  integrity="sha256-CSXorXvZcTkaix6Yvo6HppcZGetbYMGWSFlBw8HfCJo="
  crossorigin="anonymous">
</script>
<div id='result' style: 'display:none;'>
  <p></p>
</div>
<form method="post" action="#">
    <input type="button" value="Show" id='button'/>
</form>

<script type="text/javascript">
$(document).ready(function(){
    var div1Show = localStorage.getItem('div1_show');
    if (div1Show) {
        $("#div1").remove();
    } else {
        $("#div1").show();
    }
    $("#button").click(function(){
        $("#result").text("Complete");
        $("#div1").show();
        localStorage.setItem('div1_show', 'true');
    });
});
</script>

Answer 1

您正在将一个字符串放入 cookie 中，只需更改以下行

localStorage.setItem('div1_show', 'true');

布尔值

localStorage.setItem('div1_show', true);