Consider this code. Assume the axios files have been loaded from the CDN, and that our HTML includes a div element with an id='display'. function getQuote() { axios.get('http://ron-swanson-quotes.herokuapp.com/v2/quotes') .then( function(response) { quote = response.data[0]; document.getElementById('display').innerHTML = quote; }) .catch( function(error) { status = "An error occurred: " + error; }); } Why do we ask for the first element in the data array, data[0]? Because no matter what web service we request data from, that web service will always return a array of with a single element. Because we investigated the ron-swanson-quotes API, and it revealed that a request like the one we made returns an array with a single element. That element would be in index 0.
Consider this code. Assume the axios files have been loaded from the CDN, and that our HTML includes a div element with an id='display'.
function getQuote() {
axios.get('http://ron-swanson-quotes.herokuapp.com/v2/quotes')
.then( function(response) {
quote = response.data[0];
document.getElementById('display').innerHTML = quote;
})
.catch( function(error) {
status = "An error occurred: " + error;
});
}
Why do we ask for the first element in the data array, data[0]?
Because no matter what web service we request data from, that web service will always return a array of with a single element. |
||
Because we investigated the ron-swanson-quotes API, and it revealed that a request like the one we made returns an array with a single element. That element would be in index 0. |

Step by step
Solved in 4 steps









