vanilla javascript api call to display code example

Example 1: get response api using vanilajavascript

fetch('https://jsonplaceholder.typicode.com/postses').then(function (response) {
	// The API call was successful!
	if (response.ok) {
		return response.json();
	} else {
		return Promise.reject(response);
	}
}).then(function (data) {
	// This is the JSON from our response
	console.log(data);
}).catch(function (err) {
	// There was an error
	console.warn('Something went wrong.', err);
});

Example 2: vanilla javascript api request

var xhr = new XMLHttpRequest();

xhr.onload = function () {

	if (xhr.status >= 200 && xhr.status < 300) {

      const users = JSON.parse(xhr.response);
      const content = document.getElementById("user_content");
    
      for(let i in users){
          let user_name = document.createElement("p");
          let text = document.createTextNode(`User ID ${users[i].id}: ${users[i].title}`);
          user_name.appendChild(text);
          content.appendChild(user_name);
      }
    
	} else {
      console.log('The request failed!');
	}

	console.log('This always runs...');
};

xhr.open('GET', 'https://jsonplaceholder.typicode.com/posts');
xhr.send();