Question 110774 in Json Question posted in
Our archive of expertly curated questions and answers provides insights and solutions to common problems related to this popular data interchange format. From parsing and manipulating JSON data to integrating it with various programming languages and web services, our archive has got you covered. Start exploring today and take your JSON skills to the next level

Reduce data json HTML markup?

enter image description here

I am trying to figure out how to hide the last 12 numbers on price in the button, as it is way to long.

I am using a JSON api, and insertAjacentHTML markup.

This is the code.

`

<script>
    fetch('https://free-api.vestige.fi/asset/467518794/price')
      .then(res => {
        console.log(res);
        return res.json();
      })
      .then(data => {
       console.log(data.price);
         const markup = `<a>${data.price}</a>`;
         document.querySelector('button').insertAdjacentHTML('beforeEnd', markup);
      })
      .catch(error => console.log(error));
</script>

`

I tried a couple of different methods, but I am just not too great with json and javascript together.

Tags:

2

Answers


  1. 0

    Try convert you number to string then use substring:

    fetch("https://free-api.vestige.fi/asset/467518794/price")
  .then((res) => {
    console.log(res);
    return res.json();
  })
  .then((data) => {
    const numberToString = data.price.toString();
    const price = numberToString.substring(0, numberToString.length - 12);
    const markup = `<a>${price}</a>`;
    document.querySelector("button").insertAdjacentHTML("beforeEnd", markup);
  })
  .catch((error) => console.log(error));
    Login or Signup to reply.
  2. 0

    There are built-in methods for numbers in javascript that can help you manipulate those values.

    One of them is .toFixed(), it let’s you take a number of digits after the decimal. You can read more about it here.

    Here is an example:

    const number = 1254.211545
console.log(number.toFixed(4)) // result: 1254.2115

    So in your case this code below should work:

    <script>
    fetch('https://free-api.vestige.fi/asset/467518794/price')
      .then(res => {
        console.log(res);
        return res.json();
      })
      .then(data => {
       console.log(data.price.toFixed(7));
         const markup = `<a>${data.price.toFixed(7)}</a>`;
         document.querySelector('button').insertAdjacentHTML('beforeEnd', markup);
      })
      .catch(error => console.log(error));
</script>

    Or just, like @Teddy mentioned in the comments, there is also the .substring() method for strings, you need to convert you number to a string first to use it .toString()

    Login or Signup to reply.
Please signup or login to give your own answer.

Back To Top
Search