具有JSON数组值问题的Petfinder ajax请求

时间:2017-05-30 19:50:51

标签: javascript jquery json ajax

$(document).ready(function(){

    var url = 'http://api.petfinder.com/shelter.getPets?key=99392cbf55ee6b2f9b97ed375eca907d&id=WI22&status=A&output=full&format=json';

    $.ajax({

        type : 'GET',

        data : {},

        url : url+'&callback=?' ,

        dataType: 'json',
		
		crossDomain: true,

        success : function(data) {              

        	var petfinder = data.petfinder;
			
			console.log(petfinder.pets.pet[0].media.photos.photo['1','$t','x']);
			
		}
	})
})

<petfinder xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:noNamespaceSchemaLocation="http://api.petfinder.com/schemas/0.9/petfinder.xsd">
<header>
<version>0.1</version>
<timestamp>2017-05-30T19:45:18Z</timestamp>
<status>
<code>100</code>
<message/>
</status>
</header>
<lastOffset>25</lastOffset>
<pets>
<pet>
<id>35865497</id>
<shelterId>WI22</shelterId>
<shelterPetId>0349</shelterPetId>
<name>Abby</name>
<animal>Cat</animal>
<breeds>
<breed>Domestic Short Hair-black</breed>
</breeds>
<mix>no</mix>
<age>Senior</age>
<sex>F</sex>
<size>L</size>
<options>
<option>hasShots</option>
<option>noDogs</option>
<option>altered</option>
<option>noCats</option>
<option>housetrained</option>
</options>
<description>
<![CDATA[
My name is Abby! I'm known as the pretty office cat at the Humane Society, but I'm still up for adoption! I'm almost 11 years old but I'm still pretty active for my age! I was surrendered due to my owner having allergies, so it was no fault of my own! That was back in June, 2016! I don't like being picked up due to a medical complication that I have, but other than that I LOVE attention. I LOVE being petted! (Even if I shed sometimes!) I love to cuddle and, quietly, sit with the staff! I'm pretty shy at first, but it won't take me long to warm up to you! I would really enjoy a home that I can spend my golden years at! If you have any questions about me, don't hesitate to call the Humane Society! For more information on this cat or any other animals available at the Humane Society of Barron County please contact us! 715-537-9063, hsbcpets@chibardun.net or www.hsbcshelter.com
]]>
</description>
<lastUpdate>2017-05-27T15:44:18Z</lastUpdate>
<status>A</status>
<media>
<photos>
<photo id="1" size="pnt">
http://photos.petfinder.com/photos/pets/35865497/1/?bust=1488416755&width=60&-pnt.jpg
</photo>
<photo id="1" size="fpm">
http://photos.petfinder.com/photos/pets/35865497/1/?bust=1488416755&width=95&-fpm.jpg
</photo>
<photo id="1" size="x">
http://photos.petfinder.com/photos/pets/35865497/1/?bust=1488416755&width=500&-x.jpg
</photo>
<photo id="1" size="pn">
http://photos.petfinder.com/photos/pets/35865497/1/?bust=1488416755&width=300&-pn.jpg
</photo>
<photo id="1" size="t">
http://photos.petfinder.com/photos/pets/35865497/1/?bust=1488416755&width=50&-t.jpg
</photo>
<photo id="2" size="pnt">
http://photos.petfinder.com/photos/pets/35865497/2/?bust=1488416755&width=60&-pnt.jpg
</photo>
<photo id="2" size="fpm">
http://photos.petfinder.com/photos/pets/35865497/2/?bust=1488416755&width=95&-fpm.jpg
</photo>
<photo id="2" size="x">
http://photos.petfinder.com/photos/pets/35865497/2/?bust=1488416755&width=500&-x.jpg
</photo>
<photo id="2" size="pn">
http://photos.petfinder.com/photos/pets/35865497/2/?bust=1488416755&width=300&-pn.jpg
</photo>
<photo id="2" size="t">
http://photos.petfinder.com/photos/pets/35865497/2/?bust=1488416755&width=50&-t.jpg
</photo>
</photos>
</media>
<contact>
<address1>1571 Guy Avenue</address1>
<address2/>
<city>Barron</city>
<state>WI</state>
<zip>54812</zip>
<phone>715-537-9063</phone>
<fax>715-637-0108</fax>
<email>hsbcpets@chibardun.net</email>
</contact>
</pet>

{"@size":"x","$t":"http://photos.petfinder.com/photos/pets/35865497/1/? bust=1488416755&width=500&-x.jpg","@id":"1"}

我正在尝试使用Javascript访问此XML中的照片(由AJAX作为JSON返回)。我不知道如何检索图像,因为它们是如上所列的奇怪格式。对此有任何帮助将不胜感激?或者只是某个方向。

编辑:console.log(petfinder.pets.pet[0].media.photos.photo['1','$t','x']);只返回undefined

1 个答案:

答案 0 :(得分:1)

如果您想要第一张宠物的第一张照片,请尝试:

$(function() {
  var url = '//api.petfinder.com/shelter.getPets?key=99392cbf55ee6b2f9b97ed375eca907d&id=WI22&status=A&output=full&format=json';

  $.ajax({
      url: url,
      dataType: 'jsonp',
      crossDomain: true
    })
    .done(function(data) {
      console.log(
        data
        .petfinder
        .pets
        .pet[0]
        .media
        .photos
        .photo[0]['$t']
      );
    });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

OR

如果你想要第一只宠物的所有照片

$(function() {
  var url = '//api.petfinder.com/shelter.getPets?key=99392cbf55ee6b2f9b97ed375eca907d&id=WI22&status=A&output=full&format=json';

  $.ajax({
      url: url,
      dataType: 'jsonp',
      crossDomain: true
    })
    .done(function(data) {
      console.log(
        data
        .petfinder
        .pets
        .pet[0]
        .media
        .photos
        .photo
        .map(function (photo) { return photo['$t']; })
      );
    });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

OR

如果你想要所有宠物(阵列阵列)的所有照片:

$(function() {
  var url = '//api.petfinder.com/shelter.getPets?key=99392cbf55ee6b2f9b97ed375eca907d&id=WI22&status=A&output=full&format=json';

  $.ajax({
      url: url,
      dataType: 'jsonp',
      crossDomain: true
    })
    .done(function(data) {
      console.log(
        data
        .petfinder
        .pets
        .pet
        .map(function(pet) {
          return pet
            .media
            .photos
            .photo
            .map(function(photo) {
              return photo['$t'];
            });
        })
      );
    });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>