HTML and CSS Reference
In-Depth Information
json/
23afca60ebf72f8d88cdcae2c4f31866
/
goonies
?
callback
=?
"
,
function
(
json
) {
console
.
log
(
json
);
$
(
'#poster'
).
html
(
'<h2 class="loading">We'
re afraid
nothing was found
for
that search
.
Perhaps you were looking
for
The
Goonies
?</
h2
><
img id
=
"thePoster"
src
=
' + json[0].posters[0].image.url + '
/>
'
);
});
}
});
}
return
false
;
}
$
(
'#search'
).
click
(
getPoster
);
$
(
'#term'
).
keyup
(
function
(
event
){
if
(
event
.
keyCode
==
13
){
getPoster
();
}
});
});
Conclusion
That's it: a handy method of reading data from a remote API with jQuery, and manipulating the
JSON output to fit our needs.
Every API is different, and every one returns different results in a different structure — it's all
part of the fun! So, get used to using
console.log()
, and familiarize yourself with the results
set before trying to access it with code or using it in your application.
Start with something practical and entertaining: build a check-in checker with Gowalla's API;
visualize trends with Twitter's API; or make a face-recognition app with Face.com's API.
APIs are fun. By definition, the data they bring to the page is dynamic, not static. ❧