I have a site with design material, but when I update the page html with XHR the new content loses the javascript effect as I could do to reload the mdl?
To make the change between the view, I use two functions, in the first step the file url, the id of the element that will contain the html and an optional array, where I can insert javascript files
function getView(url, elementId, array = []) {
let req = new XMLHttpRequest();
req.open("get", url, true);
req.setRequestHeader("Access-Control-Allow-Origin","*");
req.setRequestHeader("Content-Type","text/html");
req.setRequestHeader("Accept","text/html");
req.onload = function() {
document.getElementById(elementId).innerHTML = this.responseText;
for(let item of array) {
insertJS(item);
}
};
req.send();
};
function insertJS(url) {
let script = document.createElement('script');
script.type = 'text/javascript';
script.async = true;
script.src = url;
let element = document.getElementsByTagName('script')[0];
element.parentNode.insertBefore(script, element);
};