title: Javascript Require in browser console
body: <p>When entering javascript the in the browsers console window:</p>
  
  <p><strong>1)</strong></p>
  
  <p>The following code works:</p>
  
  <pre><code>alert('hi');
  </code></pre>
  
  <p><strong>2)</strong></p>
  
  <p>The following doesn't:</p>
  
  <pre><code>(function() {
  var scr = document.createElement('script');
  scr.src = 'http://www.myrandomwebsite.com/myjs.js';
  document.head.appendChild(scr);
  myfunc();
  })()
  </code></pre>
  
  <p>where the <strong>myjs.js</strong> folder contains:</p>
  
  <pre><code>var myfunc = function(){alert('hi')};
  </code></pre>
  
  <p><strong>Explaining 2)</strong>
  the snippet of code entered in this case does cause the following code to appear at the end of the <strong>header</strong> tag in the source code:</p>
  
  <pre><code>&lt;script src="http://www.myrandomwebsite.com/myjs.js"&gt;&lt;/script&gt;
  </code></pre>
  
  <p>but the function <strong>myfunc</strong> isn't being recognized, because I get the following error message:</p>
  
  <blockquote>
    <p>VM132:5 Uncaught ReferenceError: myfunc is not defined</p>
  </blockquote>
  
  <p>Which leads me to believe that as a security measure, browsers don't run javascript code that is edited after the page has loaded, or something along those lines.</p>
  
  <p><strong>QUESTION:</strong> Is there a workaround of some sorts here? Whether it be a function that works like <code>require('...');</code> in most programming languages. <strong>but It can't be</strong> by installing any special extension, just something that works on the fly.</p>
  
  <p>I move around a lot, and work on different computers, and would love to be able to use some of the code I have without needing to always carry a USB with me. </p>
  
  <p>________________________ <strong>UPDATE</strong> ________________________</p>
  
  <p>The solution @Jared Smith proposed worked perfectly. Now there is one instance where it doesn't work (and I understand why). When a site has a Content-Security-Policy that doesn't allow scripts to be loaded from other URLs or any connections to be loaded:</p>
  
  <p><strong>for instance:</strong></p>
  
  <pre><code>Content-Security-Policy: script-src 'self' https://apis.google.com
  Content-Security-Policy: connect-src 'self' https://apis.google.com
  </code></pre>
  
  <p>And this makes perfect sense. My situation is that I have my own code that I run, however I wanted to be able to have this code stored on another site, and use it when I travel or am on other computers, without the need of extracting them from a USB.</p>
  
  <p>Now I understand sites whitelisting what sources scripts are loaded from for security reasons, but I don't understand why there isn't an exception when it is done by the <strong>developers console</strong>. CSP is used mostly to prevent XSS attacks and such, but someone who is in the console is purposely using code and testing features. </p>
  
  <p><strong>QUESTION:</strong> Is there some feature in the console that might allow for scripts to be loaded from an alternative site? I have been fiddling with the <strong>Source Script Snippets</strong> but haven't been able to find an option. Or might there be some other unrelated work around?</p>