<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<div class="get-title"></div>
<div class="get-title"></div>
<div class="get-title"></div>
</body>
<script>
var titleFirstPost = document.querySelectorAll('.get-title')[0];
var titleSecondPost = document.querySelectorAll('.get-title')[1];
var titleThirdPost = document.querySelectorAll('.get-title')[2];
var ourRequest = new XMLHttpRequest();
ourRequest.open('GET', 'http://wundermag.thememeister.com/wp-json/wp/v2/posts?per_page=3&_embed');
// wundermag.thememeister.com - ссылка на ваш сайт
ourRequest.onload = function () {
if (ourRequest.status >= 200 && ourRequest.status < 400) {
var data = JSON.parse(ourRequest.responseText);
console.log(data);
createHTML(data);
} else {
console.log("We connected to the server, but it returned an error.");
}
};
ourRequest.onerror = function () {
console.log("Connection error");
};
ourRequest.send();
function createHTML(HTMLdata) {
titleFirstPost.innerHTML = HTMLdata[0].title.rendered;
titleSecondPost.innerHTML = HTMLdata[1].title.rendered;
titleThirdPost.innerHTML = HTMLdata[2].title.rendered;
}
</script>
</html>
