APIリクエストサイクルの問題

https://api6.tzscan.io/から返された最初の要素v3/rolls_history/tz1NortRftucvAkD1J58L32EhSVrQEWJCEnB?number=1 は、最新のサイクルのデータです.

HTML

 <h1>Last Cycle</h1>
<div id="cycle"></div>
<div id="rollCount"></div>
<div id="rollTotal"></div>
 

JavaScript

 const url = 'https://api6.tzscan.io/v3/rolls_history/tz1NortRftucvAkD1J58L32EhSVrQEWJCEnB?number=1&page=0';
const cycleEl = document.getElementById('cycle')
const rollCountEl = document.getElementById('rollCount')
const rollTotalEl = document.getElementById('rollTotal')

fetch(url)
.then(resp => resp.json())
.then(([lastCycle]) => {
  cycleEl.innerText = lastCycle.cycle
  rollCountEl.innerText = lastCycle.roll_count
  rollTotalEl.innerText = lastCycle.roll_total
})
.catch(console.log);
 

https://codepen.io/RichardAyotte/pen/MxRWJG

The first element returned from https://api6.tzscan.io/v3/rolls_history/tz1NortRftucvAkD1J58L32EhSVrQEWJCEnB?number=1 is the data from the latest cycle.

HTML

<h1>Last Cycle</h1>
<div id="cycle"></div>
<div id="rollCount"></div>
<div id="rollTotal"></div>

JavaScript

const url = 'https://api6.tzscan.io/v3/rolls_history/tz1NortRftucvAkD1J58L32EhSVrQEWJCEnB?number=1&page=0';
const cycleEl = document.getElementById('cycle')
const rollCountEl = document.getElementById('rollCount')
const rollTotalEl = document.getElementById('rollTotal')

fetch(url)
.then(resp => resp.json())
.then(([lastCycle]) => {
  cycleEl.innerText = lastCycle.cycle
  rollCountEl.innerText = lastCycle.roll_count
  rollTotalEl.innerText = lastCycle.roll_total
})
.catch(console.log);

https://codepen.io/RichardAyotte/pen/MxRWJG

これは、Tezosの質問というよりもJavascriptの質問ですが、とにかく;

  const ul2 = document.getElementById('Cycle');
  const url2 = 'https://api6.tzscan.io/v3/rolls_history/tz1NortRftucvAkD1J58L32EhSVrQEWJCEnB?number=1&page=0';
  fetch(url2)
  .then((resp) => resp.json())
  .then(function(data){
    if (data.length > 0) {
      let span = document.createElement('span');
      span.innerHTML = `${data[0].cycle}`;
      ul2.appendChild(span)
    }
  })
  .catch(function(error) {
    console.log(error);
  });
 

返されたデータ配列に複数のアイテムが含まれる場合は、正しい要素を選択する前に配列を並べ替える必要があります.

This is more of a Javascript question then a Tezos question, but anyway;

 const ul2 = document.getElementById('Cycle');
  const url2 = 'https://api6.tzscan.io/v3/rolls_history/tz1NortRftucvAkD1J58L32EhSVrQEWJCEnB?number=1&page=0';
  fetch(url2)
  .then((resp) => resp.json())
  .then(function(data){
    if (data.length > 0) {
      let span = document.createElement('span');
      span.innerHTML = `${data[0].cycle}`;
      ul2.appendChild(span)
    }
  })
  .catch(function(error) {
    console.log(error);
  });

If you ever get multiple items in the returned data array you need to sort the array before picking the correct element.