function download() {
  const form = document.querySelector('form');
  const fd = new FormData(form);
  const data = JSON.stringify(Object.fromEntries(fd));

  const dataStr = "data:text/json;charset=utf-8," + encodeURIComponent(data);
  const downloadAnchorNode = document.createElement('a');
  downloadAnchorNode.setAttribute("href",     dataStr);
  downloadAnchorNode.setAttribute("download", "form.json");
  downloadAnchorNode.click();
}

function upload() {
  const form = document.querySelector('form');
  const input = document.createElement('input');
  input.type = 'file';

  input.onchange = e => { 
    const file = e.target.files[0]; 

    const reader = new FileReader();
    reader.readAsText(file,'UTF-8');

    reader.onload = readerEvent => {
      const content = JSON.parse(readerEvent.target.result); // this is the content!
      console.log(typeof content);
      for (const key of Object.keys(content)) {
        console.log(key);
        form.querySelector(`input[name="${key}"]`).value = content[key];
      }
    }
  }

  input.click();
}

exportButton.addEventListener('click', download);
importButton.addEventListener('click', upload);