如何使用localstorage存储动态对象数组并对特定项执行更新和删除操作？

Question

我想知道如何在LocalStorage中存储动态对象数组，并在页面上以表格格式显示它。

我还想对特定项目执行更新和删除操作。我怎么能这样做？

我试过这个：

var _local = (function () { 
    var Person = { 
        Srno: 0, 
        Name: "",
        Birthdate: "", 
        Email: "",
        Address: "",     
        Contact: "", 
    };

    this.clearuielements = function () { 
        var inputs = document.getElementsByClassName("c1"); 
        for (i = 0; i < inputs.length; i++) { 
            inputs[i].value = ""; 
        } 
    }

    this.saveitem = function() { 
        var lscount = localStorage.length; 
        var inputs = document.getElementsByClassName("c1"); 
        nameVal();

        console.log("aaaaaaaaaaaaaaaa");

        Person.Srno = inputs[0].value; 
        Person.Name = inputs[1].value; 
        Person.Birthdate = inputs[2].value; 
        Person.Email = inputs[3].value; 
        Person.Address = inputs[4].value; 
        Person.Contact = inputs[5].value;
        localStorage.setItem("Person_" + lscount, JSON.stringify(Person)); 

        location.reload(); 
    }

    function loaddata() { 
        var datacount = localStorage.length; 
        if (datacount > 0) 
        { 
            var render = "<table border='1'>"; 
            render += "<tr><th>Srno</th><th>Name</th><th>Birthdate</th><th>Email</th><th>Address</th><th>Contact</th></tr>"; 
            for (i = 0; i < datacount; i++) {
                var key = localStorage.key(i); 
                var person = localStorage.getItem(key); 
                var data = JSON.parse(person); 

                render += "<tr><td>" + data.Srno + "</td><td>" + data.Name + " </td>"; 
                render += "<td>" + data.Birthdate + "</td>"; 
                render += "<td>" + data.Email + "</td>"; 
                render += "<td>" + data.Address + "</td>"; 
                render += "<td>" + data.Contact + "</td></tr>"; 

            } 
            render+="</table>"; 

            dvcontainer.innerHTML = render; 
        } 
    }



    this.clearstorage = function() { 
        localStorage.clear(); 
        window.location.reload(); 
    }

    function nameVal() {
        document.getElementById("txtpname").focus();
        var n=document.getElementById("txtpname").value;
        var r;
        var letters = /^[a-zA-Z]+$/;
        if(n==null||n==""){
            alert("please enter user name");
            return null;
            n.focus();
        }
        else {
            if(n.match(letters)&&n!="") {
                r=ValidateEmail();
                return r;
            }
            else {
                alert("please enter alphabates");
                document.getElementById("txtpname").value="";   
                document.getElementById("txtpname").focus();
                return null;
            }
        }
    }

    function ValidateEmail()
    {
        var uemail=document.getElementById("txtpemail").value;
        var mailformat = /^\w+([\.-]?\w+)*@\w+([\.-]?\w+)*(\.\w{2,3})+$/;
        if(uemail.match(mailformat)) {
            alphanumeric();
        }
        else {
            alert("You have entered an invalid email address!");
            document.getElementById("txtpemail").value="";
            document.getElementById("txtpemail").focus();
            return null;
        }
    }

    function alphanumeric()
    { 
        var uadd=document.getElementById("txtpaddr").value;
        var letters = /^[0-9a-zA-Z]+$/;
        if(uadd==null||uadd==""){
            alert("plz enter address");

            uadd.focus();
        }
        else {
            if(uadd.match(letters)) {
                return true;
            }
            else {
                alert('User address must have alphanumeric characters only');
                document.getElementById("txtpaddr").value="";
                document.getElementById("txtpaddr").focus();
                return false;
            }
        }
    }

    function cntVal(){
        var n=document.getElementById("txtpmobile").value;
        var r1;
        var letters = /^\d{10}$/;
        if(n!==null||n!==""){
            if(n.match(letters))
            {
                r1=ValidateEmail();
                return r1;
            }
            else {
                alert("please enter contact number");
                document.getElementById("txtpmobile").value="";
                document.getElementById("txtpmobile").focus();
                return null;
            }
        }
        else {
            alert("please enter contact Number");
            return null;
            n.focus();
        }
    }

    return this; 
    window.onload = function () { 
        loaddata(); 
    }; 
})(); 

function saveitem(){
   console.log("SSSSS",_local);
    _local.saveitem();
}

function clearstorage(){
    _local.clearstorage();
}

function clearuielements(){
    _local.clearuielements();
}