Kevin Powell - Community•2y ago

How save changes to HTML on reload?

So if I dynamically add HTML elements, and reload the page, for it to not return to default but to be shown with the changes. I'm wondering is there simple code for it?

const htmlContent = document.querySelector("body").innerHTML;
        console.log(htmlContent)
        localStorage.setItem('newPage', htmlContent);

const htmlContent = document.querySelector("body").innerHTML;
        console.log(htmlContent)
        localStorage.setItem('newPage', htmlContent);

const pageAccessedByReload = (
    (window.performance.navigation && window.performance.navigation.type === 1) ||
      window.performance
        .getEntriesByType('navigation')
        .map((nav) => nav.type)
        .includes('reload')
  );
  
  if(pageAccessedByReload === true) {
    console.log("lul");
    let str = document.querySelector("body");
    str.innerHTML = localStorage.getItem("newPage");
    var parser = new DOMParser();
    var doc = parser.parseFromString(str, 'text/html');
    doc.body;
  }

const pageAccessedByReload = (
    (window.performance.navigation && window.performance.navigation.type === 1) ||
      window.performance
        .getEntriesByType('navigation')
        .map((nav) => nav.type)
        .includes('reload')
  );
  
  if(pageAccessedByReload === true) {
    console.log("lul");
    let str = document.querySelector("body");
    str.innerHTML = localStorage.getItem("newPage");
    var parser = new DOMParser();
    var doc = parser.parseFromString(str, 'text/html');
    doc.body;
  }

This is something I found on the google but It's not working the best...

1 Reply

Lord Of Insanity•2y ago

You can use local storage for that, here is the mdn article for it: https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage

Window.localStorage - Web APIs | MDN

The localStorage read-only property of the window interface allows you to access a Storage object for the Document's origin; the stored data is saved across browser sessions.

Gaming

Programming

How save changes to HTML on reload?