Advice Generator Fetch API HTML CSS JavaScript

Community feedback

• 

  Héctor Martin Dama•240

  @HectorMartinDama

  Posted over 2 years ago

  Hello @CrypticMango, your file js is good but I would change the api request into a function. That way you don't need to reload the page every time you click the button.

  File js

  function getApi(){
      fetch('https://api.adviceslip.com/advice/' + Math.floor(Math.random() * 200))
      .then(res => res.json())
      .then(res =>  {
          document.getElementById("phrase").innerHTML= '"' + res.slip.advice + '"'
          document.getElementById("id").innerHTML= 'ADVICE #'+ res.slip.id
      })
      .catch(err => console.log(err))
  }
  

  The random number is because if you do not indicate a specific advice, it does not work correctly.

  index.html

  <button onclick="getApi()"></button>
  

  Call the function in the button

  For the rest it is perfect.

  GitHub Repo Page preview

  01

  Marked as helpful