How to save a html webpage using a button and overwrite previous code

I have created a code to insert new rows into a table.
After inserting new rows in the webpage, how to save those rows to be viewed in the future.
Here’s the code:

function add(){
var x = document.getElementById(“myTable”).rows.length;
var table = document.getElementById(“myTable”);
var row = table.insertRow(x);
var cell1 = row.insertCell(0);
var cell2 = row.insertCell(1);
var cell3 = row.insertCell(2);
cell1.innerHTML = “NEW CELL1”;
cell2.innerHTML = “NEW CELL2”;
cell3.innerHTML = “NEW CELL2”;

}
function saveIt(){
document.execCommand(“SaveAs”)
}

table id=“myTable” style="width:100%"
tr>
th>Firstname</th
th>Lastname</th
th>Age</th
/tr>
tr>
td>Jill</td
td>Smith</td
td>50</td
/tr>
tr>
td>Eve</td
td>Jackson</td
td>94</td
/tr>
tr>
td>John</td
td>Doe</td
td>80</td
/tr>
/table>
button onclick=“add();”>Add a Point</buttonSave This Page<br
/body>
/html>*/

There are many ways to do that. But I think you might be interested in learning about the Web Storage API.

Further resources:


Goodluck.

1 Like

If you want the new updates viewable by everyone, You need to save the records in a database, or external JSON file on the server.

With Local Storage, you’ll be the only person that can view those changes.