У меня есть скрипт в заголовке страницы HTML, который объявляет функцию для выполнения запросов на получение данных JSON и передает ее внутренней HTML.
функции элемента, вызываемой при загрузке страницы.
Скрипт в голове корректно получает JSON данных и заполняет внутренние элементы HTML.
Я бы хотел затушевывать l oop между 2 битами JSON данных.
Скрипт в теле пытается получить внутреннее HTML элемента и создать массив для использования в качестве входных данных для перекрестного затухания l oop.
Внутренняя переменная HTML элемента возвращается пустым.
Сценарий с перекрестным затуханием l oop работает, если в массиве объявлены строки.
Здесь можно поиграть
Как получить значения JSON в текстовый цикл?
<script>
var intervalID = window.setInterval(insertText, 2000);
function insertText(){
const Http = new XMLHttpRequest();
const url = "https://api.kraken.com/0/public/Ticker?pair=XXBTZUSD";
Http.open("GET", url);
Http.send();
Http.onreadystatechange=(e)=>{
const price = Http.responseText
const priceJson = JSON.parse(price);
var priceJsonBtc = priceJson.result.XXBTZUSD.c[0];
var btc = parseFloat(priceJsonBtc)
var btcp = btc.toFixed(2)
console.log(btcp);
document.getElementById("priceUsd").innerHTML = "$" + btcp + " USD";
const usdp = btcp
}
const HttpGbp = new XMLHttpRequest();
const urlGbp = "https://api.kraken.com/0/public/Ticker?pair=XXBTZGBP";
HttpGbp.open("GET", urlGbp);
HttpGbp.send();
HttpGbp.onreadystatechange=(e)=>{
const priceGbp = HttpGbp.responseText
const priceJsonGbp = JSON.parse(priceGbp);
var priceJsonBtcGbp = priceJsonGbp.result.XXBTZGBP.c[0];
var btcGbp = parseFloat(priceJsonBtcGbp)
var btcpGbp = btcGbp.toFixed(2)
console.log(btcpGbp);
document.getElementById("priceGbp").innerHTML = "£" + btcpGbp + " GBP";
const gbpp = btcpGbp
}
}
</script>
</head>
<body onload=insertText()>
<h1 id="priceUsd"></h1>
<h1 id="priceGbp"></h1>
<h1 id="changer">£ GBP</h1>
<script>
var usd = document.getElementById("priceUsd").innerHTML;
var gbp = document.getElementById("priceGbp").innerHTML;
/* This does not work */
/* var words = [usd, gbp]; */
/* This does work */
var words = ["£ GBP", "$ USD"];
var i = 0;
var text = "BTC";
function _getChangedText() {
i = (i + 1) % words.length;
return text.replace(/BTC/, words[i]);
}
function _changeText() {
var txt = _getChangedText();
var d = document.getElementById("changer")
d.className = "fadeOut";
setTimeout(function(){
d.className = "";
document.getElementById("changer").innerHTML = txt;
}, 900);
}
setInterval("_changeText()", 1000);
</script>
</body>