2 part. How to make the js script work in the loaded file itself?

Question

JavaScript

/toster.ru/q/522913
Demo test, see.
/load
The second script is not loaded in the Chrome browser. How to fix this, if possible, I understand the question is difficult!
Everything loads in the Edge browser.
Demo test.
Page of the first loaded file:
load.html

<p>Это первый запрос load.html.</p>
<img src="data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///yH5BAEAAAAALAAAAAABAAEAAAIBRAA7" onload="

var myHead1 = document.getElementById('content');
var myHead2 = document.getElementById('your');

var date = new Date();
var locat =location.pathname;

myHead1.innerHTML = date;
myHead2.innerHTML = locat;


const myObj = foo={
  name: 'Skip',
  age: 2,
  favoriteFood: 'Steak'
};


var json_upload =  JSON.stringify(myObj); 
fetch('load2.html', { method: 'post', headers: ( 'Content-Type', 'application/x-www-form-urlencoded'  ), body: json_upload })
.then(function(response) {if(response.ok) return response.text();  })
 .then(function(data){ document.getElementById('demo2').innerHTML = data;  })
;

//this.parentNode.removeChild(this);
" />

load2.html

<p>Это второй запрос из подгруженного load.html в load2.html</p>

Answer 1

If I understand your question correctly, you have part of the page requested and inserted via innerHTML . In this case, javascript inserted among other code is not executed. This is fine. Here https://stackoverflow.com/questions/1197575/can-sc... you can read more.
You can fix it if you manually execute js via eval(). Those. something like this:

document.getElementById('demo2').innerHTML = data;
$('#demo2 script').each((index, elem) => eval(elem.text()))

Links:
https://www.w3.org/TR/2008/WD-html5-20080610/dom.h...
https://developer.mozilla.org/en-US/docs/Web/API/E. ..