How to write to a seperate html file in plain browser javascript?

Question

I know that you can write to the current HTML document, but I want to write to another html file. For example: I have 2 files, one is index.html , and the other is completedsurvey.html I want to write something to the completedsurvey.html from my index.html file. Is there a way
to do this that is supported in most browsers?

Answer 1

So for the first solution: Assuming you'd want to display "username" and "summary" on successful submission of the form. This isn't an exact solution, just something you can use to get the concept.

index.html

    <form>
    <input type='text' id="username">
    <input type='text' id="summary">
    <button type="button" id="process-form">
    </form>
    
    <script>
       document.getElementById('process-form').addEventListener('click', (eve)=>{
       
    
          var uname = document.getElementById('username');
          var summ = document.getElementById('summary');
          localStorage.setItem('uname', uname);//saving the data in local storage
          localStorage.setItem('summ', summ);
//redirect to next page...
       });
    </script>

surveycomplete.html

<!doctype>
.
.
<div> 
<h1 id="name"> </h1>
<p id='summary'> </p>
</div>
<script>
  var uname = localStorage.getItem('uname');//retrieving from local storage
  var summ = localStorage.getItem('summ');
  document.getElementById('name').innerHTML = uname;//fill the fields with data 
  .
  .
</script>

Further Links: https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage