title: Execute code from inline script that is fetched from another source
body: <p>I have a React app and am fetching index.html from one server location and want to run its scripts from another server location:</p>
  <pre><code> const entries = await axios.get(`http://localhost:xxx`);
   let domParser = new DOMParser();
   let tempDOM = domParser.parseFromString(entries.data, 'text/html');
   const scriptLoads = tempDOM.querySelectorAll('script').forEach(script =&gt; 
      if (!script.src) {
          const inlineScript = document.createTextNode(eval(script.text));
          scriptElement.appendChild(inlineScript);
          document.body.appendChild(scriptElement);
        } 
   )
  </code></pre>
  <p>The above code grabs the inline  tags included inside <strong>index.html</strong>. It would do the job (<code>executing the inline script</code>) if <code>eval</code> should not be prevented from running. To be honest, am not sure what exactly is blocking eval. However, my question is how we can change the above code and not using eval. Is there any orthodox way? I have tried a lot of things, however nothing works...</p>
  <p>For example the following works fine:</p>
  <pre><code>document.createTextNode(&quot;alert('Hello World!');&quot;);
  </code></pre>
  <p>but not this one:</p>
  <pre><code>document.createTextNode(script.text);
  </code></pre>