class blogFooter extends HTMLElement { constructor(){ super(); this.getBlogEntries(); } async getBlogEntries() { let ul = document.createElement("ul"); this.appendChild(ul); var graphql = JSON.stringify({ query: 'query($count: Int!) { blogPosts(count: $count) { title id }}', variables: { "count": 5 } }) var requestOptions = { method: 'POST', body: graphql, }; let posts = (await (await fetch("http://localhost:1234/API/graphql.php", requestOptions)).json()).data.blogPosts; posts.forEach((element) => { let li = document.createElement("li"); let a = document.createElement("a"); a.href = "/post.html?id=" + element["id"]; a.innerText = element["title"]; li.appendChild(a); ul.appendChild(li); }); } } customElements.define("jl-footer_blog", blogFooter);