Ajax 从XMLHttpRequest获取JSON数据

我需要一些帮助

我有一份狗品种列表，如下：

breedListRequest.onload = function () {
   var breedListData = JSON.parse(this.response);
   var breeds = breedListData.message;
   console.log('All Breeds');
   console.log(breeds);
   console.log('Test');
   console.log(terrierSubBreed); // Testing sub breed object in console.
}

然后是这个亚品种，这里：

terrierSubBreed.onload = function() {
  var terrierSubBreedList = JSON.parse(this.response);
  var terrierSubBreed = terrierSubBreedList.message;
  console.log('Terrier Subbreed');
  console.log(terrierSubBreed);
  return terrierSubBreed;
}

我试图从其onload函数中提取terrier子品种数据/对象，并将其附加到品种列表中的对象。每次这样做，我得到的都是XMLHttpRequest对象，而不是对象本身

---

尝试在terrierSubBreed.onload=函数{}之外声明变量terrierSubBreed，以便用terrierSubBreedList.message填充它

如果这样做有效，请尝试：

// Somewhere above, outside of functions
var terrierSubBreed = '';

terrierSubBreed.onload = function() 
{
    var terrierSubBreedList = JSON.parse(this.response);
    terrierSubBreed = terrierSubBreedList.message;
    console.log('Terrier Subbreed');
    console.log(terrierSubBreed);
}

breedListRequest.onload = function () 
{
    // ...

    if(terrierSubBreed.length > 0) console.log(terrierSubBreed);
}

---

您应该使用helper函数来发出请求，而不会出现问题

大概是这样的：

var newXHR = null;   
function sendXHR(type, url, data, callback) {
  newXHR = new XMLHttpRequest() || new window.ActiveXObject("Microsoft.XMLHTTP");
  newXHR.open(type, url, true);
  newXHR.send(data);
  newXHR.onreadystatechange = function() {
    if (this.status === 200 && this.readyState === 4) {
      callback(this.response);
    }
  };
}

上述帮助器函数适用于所有浏览器

其中：

type=可以是HTTP谓词，在本例中为GET。 url=要请求的url字符串。 data=可以为空。 callback=响应就绪时的回调函数。this.status==200&&this.readyState==4。 用法：

// First request.
sendXHR("GET", "https://dog.ceo/api/breeds/list/all", null, function(response) {
  breeds = JSON.parse(response); // Stores the data of dog breeds in breeds variable.

  // Second request.
  sendXHR("GET", "https://dog.ceo/api/breed/terrier/list", null, function(response) {
    subBreeds = JSON.parse(response); // Stores the data of dog sub breed in subBreeds variable.

    subBreeds.message.map(function(x) { // For every sub breed appends the current value to the breeds.message.terrier array.
      breeds.message.terrier.push(x); // x = sub breed.
    });
    console.log(breeds.message);
  });
});

关于您的问题：您应该使用以下选项：

subBreeds.message.map(function(x) {
  breeds.message.terrier.push(x);
});

对于terrier数组中的每个子品种，将当前值附加到brides.message.terrier数组

大概是这样的：

var newXHR = null;   
function sendXHR(type, url, data, callback) {
  newXHR = new XMLHttpRequest() || new window.ActiveXObject("Microsoft.XMLHTTP");
  newXHR.open(type, url, true);
  newXHR.send(data);
  newXHR.onreadystatechange = function() {
    if (this.status === 200 && this.readyState === 4) {
      callback(this.response);
    }
  };
}

作用{ var newXHR=null，//在全局范围中定义。因此，我们可以在必要时中止XHR请求。 brides={}，//在全局范围内声明brides对象。 subbrides={}；//在全局范围内声明subbrides对象。 函数sendXHRtype、url、数据、回调{ newXHR=new XMLHttpRequest | | new window.ActiveXObjectMicrosoft.XMLHTTP； newXHR.opentype，url，true； newXHR.senddata； newXHR.onreadystatechange=函数{//使用onreadystatechange代替onload。 如果this.status==200&&this.readyState==4{ callbackthis.response； } }; } sendXHRGET，https://dog.ceo/api/breeds/list/all，null，functionresponse{ brides=JSON.parseresponse； sendXHRGET，https://dog.ceo/api/breed/terrier/list，null，functionresponse{ subbrides=JSON.parseresponse； subbrides.message.mapfunctionx{ 繁殖.message.terrier.pushx； }; console.log.message； }; }; }; .作为控制台包装{ 位置：相对位置； 排名：0；

---

}谢谢大家!！帮了我大忙！我真的需要一个函数来处理代码xD的重复性。这正是我想要的答案。