Skip to content

jrodden1/jsdom-fetch-dog-ceo-challenge-online-web-ft-061019

 
 

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

4 Commits
 
 
 
 
 
 
 
 

Repository files navigation

Fetch Dog CEO Challenge

Challenge 1

This repository includes an index.html file that loads an index.js file.

const imgUrl = "https://dog.ceo/api/breeds/image/random/4"

Add JavaScript so that:

  • on page load
  • fetch the images using the url above ⬆️
  • parse the response as JSON
  • add image elements to the DOM for each🤔 image in the array

Challenge 2

const breedUrl = 'https://dog.ceo/api/breeds/list/all'

After the first challenge is completed, add JavaScript so that:

  • on page load, fetch all the dog breeds using the url above ⬆️
  • add the breeds to the page in an <ul> (take a look at the included index.html)

Challenge 3

Once all of the breeds are rendered in the <ul>, add JavaScript so that the font color of a particular <li> changes on click. This can be a color of your choosing.

When the user clicks any of the dog breed list items, the color the text should change.


Challenge 4

Once we are able to load all of the dog breeds onto the page, add JavaScript so that the user can filter breeds that start with a particular letter using a dropdown.

For example, if the user selects 'a' in the dropdown, only show the breeds with names that start with the letter a. For simplicity, the dropdown only includes the letters a-d. However, we can imagine expanding this to include the entire alphabet


dog ceo

About

No description, website, or topics provided.

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages

  • JavaScript 82.3%
  • HTML 17.7%