Как сравнить данные JSON из одного и того же запроса API? - PullRequest
Новая
       33

Как сравнить данные JSON из одного и того же запроса API?

0 голосов
/ 13 апреля 2019

Я все еще много узнаю о веб-разработке и javascript, так что извините, если мои объяснения не ясны.

У меня есть функция запрашивать у API информацию о криптовалюте (цена, объем и т. Д.) В файле JSON, а затем я отображаю цену на веб-странице каждые 15 секунд.

Я хочу изменить цвет фона карты, на которой отображается цена, путем сравнения фактической цены и новой цены, поступающей из следующего запроса.

вот мой JavaScript: 

function requestPrice(url, domLocation){
var req = new XMLHttpRequest();
req.open("GET", url);
req.addEventListener("load", function() {
    if (req.status >= 200 && req.status < 400) { 
        var data = JSON.parse(req.responseText)
        domLocation.innerHTML = data.ticker.price + "$";
        erreur.innerHTML = "";
    } else {
        erreur.innerHTML = "Erreur: " + req.status + " " + req.statusText;
    }
});
req.addEventListener("error", function () {
    erreur.innerHTML = "Erreur";
});
req.send(null);
}

var btcPrice = document.getElementById('boxBTC'), erreur = 
document.getElementById('erreur');

setInterval(requestPrice("https://api.cryptonator.com/api/ticker/btc-eur", 
btcPrice), 15000);

Я думал о простом сравнении значений и поместил этот код в свой цикл, но мне нужно где-то хранить фактическую цену, чтобы провести сравнение с новой, и я застрял с этим. 

if (valueOf(data.ticker.price) <= valueOf(data.ticker.price)){
document.getElementById('overviewcard').style.backgroundColor = red;
} else {
document.getElementById('overviewcard').style.backgroundColor = blue;
}

Или 

var overviewcard = getElementById('overviewcard');
if (data.ticker.price <= data.ticker.price){
overviewcard.style.backgroundColor = red;
} else { 
overviewcard.style.backgroundColor = blue;
}

вот HTML: 

    <div class="overviewcard">
       <span id="boxBTC">...</span>
       <span id="erreur"></span>
    </div>

Большое спасибо за вашу помощь

1 Ответ

1 голос
/ 13 апреля 2019

Вы можете сделать это множеством способов, но самое простое - извлечь данные из фактического элемента HTML DOM.

var currValue = document.getElementById('boxBTC').innerHTML;
if(valueOf(data.ticker.price) == currValue) {
    // do something
}

Если ваша строка boxBTC слишком сильно отформатирована (например, если вы наберете "1000" -> "1000"), то вы всегда можете также сохранитьАтрибут данных необработанного значения внутри DOM в качестве атрибута данных. 

// assigning the data
document.getElementById('boxBTC').setAttribute('data-val', price);
...
// accessing the data
document.getElementById('boxBTC').getAttribute('data-val');
...