Responsive solution with HTML, CSS and JS

Community feedback

• Account deleted

  My Recommendation

  const getAdvice = async () => {
      const resp = await fetch(URL)
      const data = await resp.json()
      const datos = {data}
      console.log(datos.data.slip.id)
     ==> **header.innerHTML = `Advice #${datos.data.slip.id}`** 
      console.log(datos.data.slip.advice)
     ==> **advice.innerHTML = `"${datos.data.slip.advice}"`**
  }
  

  don't use innerHTML instead use textContent in most cases the functionality of innerHTML is if you want to include an HTML elements inside of the string and wants to appear in the webpage including the default design of that HTML elements will be show example header.innerHTML = <h5>Advice #${datos.data.slip.id}</h5> in the webpage the text of Advice, will be wrap in the h5 element but the <h5></h5> will not be show only the text

  since you're working on a API in a lower version of browser by using of innerHTML can create a potential of security risk. so much better use textContent

  summary

  • use textContent instead innerHTML so it will avoid the possible security risk since you're working on a API

  if you're curios to learn more about this just check the link below

  https://betterprogramming.pub/dom-manipulation-
  the-dangers-of-innerhtml-602f4119d905#:~:text='innerHTML'%20
  Presents%20a%20Security%20Risk,
  the%20MDN%20documentation%20on%20innerHTML%20.
  

  Marked as helpful

  1

  ---

  

  ezequielmagi•60

  @ezequielmagiPosted about 2 years ago

  @okayda THANK YOU VERY MUCH! I will work on that!

  0