55 lines
1.1 KiB
HTML
55 lines
1.1 KiB
HTML
|
<!DOCTYPE html>
|
||
|
|
<html>
|
||
|
|
<head>
|
||
|
|
<meta charset="utf-8">
|
||
|
|
|
||
|
|
<title>Our superheroes</title>
|
||
|
|
|
||
|
|
<link href="https://fonts.googleapis.com/css?family=Faster+One" rel="stylesheet">
|
||
|
|
<link rel="stylesheet" href="style.css">
|
||
|
|
</head>
|
||
|
|
|
||
|
|
<body>
|
||
|
|
|
||
|
|
<header>
|
||
|
|
|
||
|
|
</header>
|
||
|
|
|
||
|
|
<section>
|
||
|
|
|
||
|
|
</section>
|
||
|
|
|
||
|
|
<script>
|
||
|
|
|
||
|
|
async function populate() {
|
||
|
|
|
||
|
|
const requestURL = 'https://social.tchncs.de/api/v1/statuses/107735248507147283';
|
||
|
|
const request = new Request(requestURL);
|
||
|
|
|
||
|
|
const response = await fetch(request);
|
||
|
|
const mastopost = await response.json();
|
||
|
|
|
||
|
|
populateHeader(mastopost);
|
||
|
|
// populateHeroes(mastopost);
|
||
|
|
|
||
|
|
}
|
||
|
|
|
||
|
|
function populateHeader(obj) {
|
||
|
|
const header = document.querySelector('header');
|
||
|
|
const myH1 = document.createElement('h1');
|
||
|
|
myH1.textContent = obj['account']['display_name'];
|
||
|
|
header.appendChild(myH1);
|
||
|
|
|
||
|
|
const myPara = document.createElement('article');
|
||
|
|
myPara.innerHTML = `${obj['content']}`;
|
||
|
|
header.appendChild(myPara);
|
||
|
|
}
|
||
|
|
|
||
|
|
|
||
|
|
|
||
|
|
populate();
|
||
|
|
|
||
|
|
</script>
|
||
|
|
</body>
|
||
|
|
</html>
|