If the browser has loaded the document and all external resources, you can load and fire via button/click based on xmlhttprequest() more JavaScript files and HTML documents with integrated JavaScript files?
index.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<script type="text/javascript" src="rq.js"></script>
</head>
<body></body>
</html>
rq.js
function put() {
const xhrURL = 'load.php';
const xhr = new XMLHttpRequest();
xhr.open('GET', xhrURL, false);
xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
xhr.onreadystatechange = function bar() {
if (this.readyState === XMLHttpRequest.DONE && this.status === 200) {
document.head.innerHTML += xhr.responseText;
}
};
xhr.send(null);
}
window.onload = function a() {
// Button
const btn = document.createElement('button');
btn.innerHTML = 'click here';
btn.value = 'click here';
btn.type = 'button';
btn.onclick = function p() {
put();
};
document.body.appendChild(btn);
};
load.php
function loadSources() {
readfile('page1.html');
echo '<script type="text/javascript" src="test.js"></script>';
}
$_POST[loadSources()];
page1.html
<script type="text/javascript" src="fromPage1.js"></script>
fromPage1.js
console.log('from Page 1');
document.write('from Page 1');
test.js
console.log('Testfile');
document.write('Testfile');
Unexpected: After clicking on the button Loading the scripts but the script not executed.
Expected: After clicking on the button Loading the scripts and the script are executed.
Update this answer helped me: https://stackoverflow.com/a/47614491/9050912
