javascript-為什么我不能使用存儲變量而不是本地存儲？

Question

所以我嘗試在下面使用localStorage替換此代碼

var myButton = document.querySelector('button');
var myHeading = document.querySelector('h1');

function setUserName() {
  var myName = prompt('Please enter your name.');
  localStorage.setItem('name', myName);
  myHeading.textContent = 'Mozilla is cool, ' + myName;
}
if(!localStorage.getItem('name')) {
  setUserName();
} else {
  var storedName = localStorage.getItem('name');
  myHeading.textContent = 'Mozilla is cool, ' + storedName;
}
myButton.onclick = function() {
  setUserName();
}

使用此代碼從存儲的變量中檢索。

var myButton = document.querySelector('button');
var myHeading = document.querySelector('h1');

var myName;
function setUserName() {
  myName = prompt('Please enter your name.');
  //localStorage.setItem('name', myName);
  myHeading.textContent = 'Mozilla is cool, ' + myName;
}
if(!myName) {
  setUserName();
} else {
  //var storedName = localStorage.getItem('name');
  myHeading.textContent = 'Mozilla is cool, ' + myName;
}
myButton.onclick = function() {
  setUserName();
}

為什么它不能相應地工作？

Answer 1

刷新頁面時，所有變量都將被清除。 這樣， if(!myName)返回true，並再次提示用戶。 LocalStorage允許您將變量保存為瀏覽器中頁面刷新之間的鍵/值對。

另外，在sessionStorage vs localStorage上查看以下答案： HTML5 Local storage vs. Session storage