title: Read javascript file and execute code
body: <p>I'm building a map similar to Google Maps using HTML5 canvas. I'm also creating a tiling system where tiles are only loaded when dragged on screen.</p>
  
  <p>So I have multiple javascript files that will draw on the canvas, each one a tile. One of the files might look like this (ctx being the canvas 2d context):</p>
  
  <pre><code>ctx.fillStyle="rgb(255,255,255)";
  ctx.beginPath();
  ctx.moveTo(256,197);
  ctx.lineTo(177,241);
  ctx.fill();
  </code></pre>
  
  <p>Now, I know one method of calling and executing the javascript files, which is like so:</p>
  
  <pre><code>function getTile(src){
        var tileScript = document.createElement('script');
        tileScript.src = src;
        var head = document.getElementsByTagName('head')[0];
        head.appendChild(tileScript); }
  </code></pre>
  
  <p>But I don't really want large numbers of script tags being added to the document head. With all the layers in the map, this might end up being a ridiculous number of scripts like 50.</p>
  
  <p>Is there another method of reading and executing these files? Alternatively, if anyone could suggest an entirely better method of going about this, I would be open to suggestions.</p>