I "fetch" some content from html pages to append it to my content, there is no problem with the code, but I was wondering if there is a better way to use the DOMParse.parseFromString() since after I parse the html string it create a unnecessary basic html structure like <html>, <head> and <body>
with my element inside, so after parse I have to use a querySelector() to get my element inside the page html that it creates.
My question is there is any way to just create the element without this tags?
my code is like this:
function insertFormAddAlunoHTML(){
fetch('./myElementHTML.html')
.then((res)=> res.text()) // => <div id='myElement'></div>
.then((stringElement)=>{
return new DOMParser().parseFromString(stringElement, 'text/html');
/* adds a unecessary html structure like:
<html>
<head></head>
<body>
<div id='myElement'></div>
</body>
</html> */
})
.then((html)=>{
//get the element inside the page
let myElement = html.querySelector('#myElement');
}).catch((err)=> console.log(err));
}
You can use
return new DOMParser().parseFromString(stringElement, 'text/html').body.firstElementChild;