如何在纯 JavaScript 中编写 $.get(url, function(data) [重复]

Question

这是我想要弄清楚的。 如何在纯 JavaScript 中编写 $.get(url,function(data) { code };。

function newimage(keyword){
  if(!ACCESS_KEY){
    alert("Please update your access key");
    return;
  }
  var url = `https://api.unsplash.com/search/photos?query=${keyword}&per_page=20&orientation=landscape&client_id=${ACCESS_KEY}`;
  $.get(url,function(data){
    var picture = data.results[0];
    var picture_url = picture.urls.raw;
    var photo_by_name = picture.user.name;
    var photo_by_url = picture.user.links.html;
    setCookie("picture",picture_url,0.5);
    setCookie("photo-by-name",photo_by_name,0.5);
    setCookie("photo-by-url",photo_by_url,0.5);
    picInterest.innterHTML = `${keyword}`;
    photoBy.innterHTML = `${photoByUrl}`;
    photoBy.setAttribute('html', photoByUrl);
    document.querySelector("body").style.backgroundImage = `url(${pictureUrl})`;
    pictureOption.style.display = "block";
  });
}

Answer 1

你可以像这样使用 fetch api：

fetch(url).then(res => res.json()).then(data => {
  //whatever you want
})

Answer 2

你可以用这个：

var url = `https://api.unsplash.com/search/photos?query=${keyword}&per_page=20&orientation=landscape&client_id=${ACCESS_KEY}`;
var xhr = new XMLHttpRequest ();
xhr.open ( "GET", url);
xhr.onreadystatechange = function ()
{
  if ( xhr.readyState === XMLHttpRequest.DONE && xhr.status === 200)
  {
    // Here you handle the response
    // Result text will be accessible at xhr.responseText
  }
}
xhr.send ();