I'm playing about with the Last.FM API for a personal project. One of the things I'd like to do is grab the images for the artists. This is how they're presented within an artist object:
{
name: "Eels",
playcount: "8067",
mbid: "14387b0f-765c-4852-852f-135335790466",
url: "https://www.last.fm/music/Eels",
streamable: "0",
image: [
{
#text: "https://lastfm-img2.akamaized.net/i/u/34s/6dc93c3bba454f6aa0528dedf9a4b3ef.png",
size: "small"
},
{
#text: "https://lastfm-img2.akamaized.net/i/u/64s/6dc93c3bba454f6aa0528dedf9a4b3ef.png",
size: "medium"
},
{
#text: "https://lastfm-img2.akamaized.net/i/u/174s/6dc93c3bba454f6aa0528dedf9a4b3ef.png",
size: "large"
},
{
#text: "https://lastfm-img2.akamaized.net/i/u/300x300/6dc93c3bba454f6aa0528dedf9a4b3ef.png",
size: "extralarge"
},
{
#text: "https://lastfm-img2.akamaized.net/i/u/300x300/6dc93c3bba454f6aa0528dedf9a4b3ef.png",
size: "mega"
}
],
@attr: {
rank: "1"
}
},
Here's what I've tried within a function to display the content:
topFive.forEach(function(artist, index){
var artistPhoto = document.createElement('img');
var artistName = document.createElement('p');
var artistPlays = document.createElement('p');
for (var picture of artist.image) {
console.log(picture.text);
console.log(picture.#text); // (doesn't work)
}
I'm just console logging at the moment to see if I can grab it. If I console.log 'picture', it gives me an object like this:
{#text: "https://lastfm-img2.akamaized.net/i/u/34s/6dc93c3bba454f6aa0528dedf9a4b3ef.png", size: "small"}
I'm just not clear on how I access object keys that have hashes infront of them