我编写了此代码，用于将表单数据保存到本地存储
<HTML>
<head>
<script>
function myfunction1() { texttosave = document.getElementById('textline').value; localStorage.setItem('mynumber', texttosave); } function myfunction2() { document.getElementById('recalledtext').innerHTML = localStorage.getItem('mynumber'); } function myfunction3() { localStorage.removeItem('mynumber'); return ''; }
</script>
</head>
<body onload='myfunction2()'>
<input type="text" id="textline" placeholder="Enter Your Name" /> <button id="rememberer"
onclick='myfunction1()'>Save</button> <button id="recaller" onclick='myfunction3()'>Delete Your Name</button>
<br>
Welcome<span id="recalledtext">Dear Visitor,</span> Refresh the page to see changes
</body>
</HTML>
如果您输入您的姓名并单击“保存”按钮，则会将您的姓名保存到本地存储中。然后，如果您刷新页面，您将在表单下方看到“欢迎'您的名字'刷新页面以查看更改”。您只需单击删除按钮即可从本地存储中删除您的名字。 所有这些任务都在进行。但是，如果访问者没有保存任何名称或者访问者单击删除按钮，我想显示跨度内的原始文本(亲爱的访问者，)。请告诉我该怎么做
最佳答案
您可以创建一个新的 myfunction4() 来重置值(尽管也许您可以找到比这更好的名称):
function myfunction4(){
document.getElementById('recalledtext').innerHTML = "Dear visitor,";
}
并且您可以在用户单击删除时调用它:
function myfunction3() {
localStorage.removeItem('mynumber');
myfunction4();
return '';
}
当保存的名称为空时，您实际上根本不需要执行任何操作。
function myfunction2() {
if(localStorage.getItem('mynumber')!="") {
document.getElementById('recalledtext').innerHTML = localStorage.getItem('mynumber');
}
}
关于javascript - 将数据保存到localstorage，通过innerHTML显示，如果数据中没有内容，则显示span(Visitors)的原文，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/45528525/