title: Tampermonkey to access a JSON call/ URL on a page?
body: <p>I have a page <code>index.html</code> which calls an external URL. This external URL is a JSON endpoint. In other words, I see two resources when I open dev tools (with <kbd>F12</kbd>): <code>index.html</code> and <code>myJSONEndpoint</code>.</p>
  
  <p>I want to be able to grab that JSON each time I load <code>index.html</code> and do something with it.</p>
  
  <p>Would Greasemonkey or Tampermonkey be able to achieve this?</p>
  
  <p>Page example:</p>
  
  <pre><code>&lt;!doctype html&gt;
  &lt;html&gt;
  &lt;head&gt;
   &lt;title&gt;Weather&lt;/title&gt;
  &lt;script&gt;
     var xmlhttp = new XMLHttpRequest();
     xmlhttp.onreadystatechange = function() {
        if (this.readyState == 4 &amp;&amp; this.status == 200) {
               var myObj = JSON.parse(this.responseText);
          }
   };
  xmlhttp.open("GET", "https://api.weather.gov/points/39.7456,-97.0892", true);
  xmlhttp.send();
  &lt;/script&gt;
  &lt;/head&gt;
  &lt;body&gt;
    &lt;p&gt;Page Loaded...&lt;/p&gt;
  &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>When I load that page, two requests appear in dev-tools. Base index page and the JSON request.</p>
  
  <p>I want to grab the JSON content and push it onto the DOM. The User can then copy/paste from there.<br>
  Create a new <code>&lt;div&gt;</code> and then stick the contents in there?</p>