从本地存储到 HTML 页面的显示名称

Question

I want my html page will display "WELCOME" and the user name from local storage. I have the name in local storage but I don't know how to display it in HTML page

js file:

//register
function store(){
    event.preventDefault();
    var name = document.getElementById('name').value;
    var pw = document.getElementById('pw').value;
    ...
    const user = { name: name, pw: pw};
    const userObjectString = JSON.stringify(user);
    localStorage.setItem(name, userObjectString);
    window.location = "./user.html";
    alert('Your account has been created');
  }
 //login
 function check(){
        event.preventDefault();
        var userName = document.getElementById('userName').value;
        var userPw = document.getElementById('userPw').value;
        var userObjectString = window.localStorage.getItem(userName);
        if (!userObjectString && userName != "gk" && userPw != "123") {
            alert('Error on login');
        } else {
            var user = JSON.parse(userObjectString);
            if(userName == user.name && userPw == user.pw){
                alert('You are logged in.');
                window.location = "./user.html";
            } else {
                alert('Error on login');
            }
         }
       }

Answer 1

You need quotes in the localStorage key AND use textContent to stop possibly XSS:

localStorage.setItem("name", userObjectString); 

then you can do

const obj = JSON.parse(localStorage.getItem("name") || \`{}\`);
if (obj && obj.name) document.querySelector("h1").textContent += obj.name;

assuming you have

<h1>Welcome</h1>

Note you may want to sanitize the name before saving it