[SOLVED] Getting JSON exchange rate from fixer.io to HTML

Getting JSON exchange rate from fixer.io to HTML

I'm trying to get the current USD to EUR rate from fixer.io into a single line in a HTML file and replace the "." in the USD value with a ",".

Can somebody help me?

LINK: https://api.fixer.io/latest?symbols=USD

{
  "base": "EUR",
  "date": "2017-12-04",
  "rates": {
    "USD": 1.1865
  }
}

What i need in a HTML file:

1,1865

EDIT:

This is what i tried so far (literally never done this before):

HTML:

<span id="rate_usd"></span>

JS:

$(document).ready(function(){
  var url= "https://api.fixer.io/latest?symbols=USD"
  $.getJSON(url,function(data){
    document.getElementById("rate_usd").innerHTML = data.rates.USD;

  });
});

Solution

Try the below, it includes all the HTML, JS and jQuery dependency you were referencing.

You were pretty close, here we are taking the number returned by the API, converting it to a string with toString() and then replacing the . with , as requested.

<html>
  <head>
    <title>USD Rate</title>
  </head>
  <body>
    <span id="rate_usd"></span>
    <script
      src="https://code.jquery.com/jquery-3.2.1.min.js"
      integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4="
      crossorigin="anonymous"></script>
    <script>
      $(function() {
        $.getJSON('https://api.fixer.io/latest?symbols=USD', function(data) {
          var usdRate = data.rates.USD.toString();
          var commaFormatted = usdRate.replace('.', ',')
          document.getElementById('rate_usd').innerHTML = commaFormatted;
        });
      });
    </script>
  </body>
</html>