Tengo un llamado a una API que me trae el precio del Bitcoin y lo imprimo dentro de una tabla, pero la función que implementé la ejecuto haciendo uso de Jquery... pero ya no quiero hacer uso de ello pero tampoco he encontrado la manera de insertar este código con JavaScript puro
El código de la función que me hace el llamado y en caso de ser exitoso el llamado, que me imprima en el DOM dentro del div con el id "priceBitcoin" el precio del bitcoin
function getBTCPrice() {
setTimeout(() => {
fetch(
"https://rest.coinapi.io/v1/exchangerate/BTC/USD?apikey=ABCD"
)
.then((response) => response.json())
.then(function (data) {
let precio = "$" + Math.trunc(data.src_side_base[0].rate);
console.log("Se inicializa el precio de BITCOIN en una variable");
$("#priceBitcoin").html(printPrice(precio));
})
.catch((error) => console.log("BITCOIN Se presentó el ERROR " + error));
}, 400);
}
Junto con la siguiente función que me retorna contenido en una etiqueta de p el precio que se le ingresa
//Funcion imprimir precio en etiqueta parrafo
function printPrice(precio) {
let parrafo = "<price>";
for (i = 0; i < 1; i++) {
parrafo += "<p>" + precio + "<p>";
}
return parrafo;
}
No he encontrado la manera de insertarlo con JavaScript puro
innerHTML
no es la mejor opción para contenido fuera de tu control, porque ese contenido puede ser inyección de código malicioso el cualinnerHTML
va a ejecutar sin verificar nada, una mejor alternativa es usartextContent
.