title: How to save a javascript array as an external file and then load it
body: <p>I am trying to do a webpage in which the user types some text into a text field and this text is shown below. I managed to display the text that the user types by adding this text into an array every time they click de submit button. I want this "comments" written by the user to the displayed every time someone loads the webpage, regardless of who typed the comment. So it would be kind of like a guestbook. 
  What I tried to do so far is to save the array in an external file and then load this file when the page reloads. The problem is that I haven't find a way to do this when searching in stackoverflow and google.
  Do you have any suggestions on how I can do this?</p>
  
  <p>HTML:</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
  &lt;head&gt;
      &lt;meta charset="utf-8"&gt;
      &lt;link href="css/reset.css" type="text/css" rel="stylesheet"&gt;
      &lt;link href="css/style1.css" type="text/css" rel="stylesheet"&gt;
      &lt;title&gt;Speak your mind&lt;/title&gt;
  &lt;/head&gt;
  &lt;body&gt;
      &lt;div id="header"&gt;&lt;h1&gt;Speak Your Mind&lt;/h1&gt;&lt;/div&gt;
      &lt;div id ="description"&gt;&lt;h2&gt;Share with the world whatever is in your mind right now!        &lt;/h2&gt;&lt;/div&gt;
      &lt;div id="writeText"&gt;&lt;textarea rows="4" cols="50" id="writeThought"&gt;&lt;/textarea&gt;&lt;/div&gt;
      &lt;div id="submitThoughtContainer"&gt;&lt;button id="submitYourThought"&gt;Submit Your Thought! &lt;/button&gt;&lt;/div&gt;
      &lt;div id="thoughtsContainer"&gt;&lt;/div&gt;
      &lt;script src="js/script.js"&gt;&lt;/script&gt;
  &lt;/body&gt;    
  &lt;/html&gt;
  </code></pre>
  
  <p>Javascript:</p>
  
  <pre><code>var thoughts = [];
  
  window.addEventListener('load', function() {
  var writeThought = document.getElementById('writeThought');
  var recentThought;
  var thoughtsContainer = document.getElementById('thoughtsContainer');
  var submitYourThought = document.getElementById('submitYourThought');
  var thoughtsTemporal = "";
  
  submitYourThought.addEventListener('click', function() {
      recentThought = writeThought.value;
      thoughts.splice(0, 0, recentThought);
      writeThought.value = "";
      thoughtsTemporal = "";
      for(var i = 0; i &lt; thoughts.length; i++) {
          thoughtsTemporal += '&lt;div class="thoughts"&gt;'+ thoughts[i] +'&lt;/div&gt;';
          thoughtsContainer.innerHTML = "" + thoughtsTemporal;
          }
      });                      
  });
  </code></pre>