Created
March 15, 2021 02:27
-
-
Save AsthaSharma1/a9ebb5edb0c747c2882c3512cc214b9a to your computer and use it in GitHub Desktop.
FULL Javascript Code for Dynamic Text tutorial for www.heyastha.com
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<script> | |
let allElemsElm = document.getElementById("allElems") | |
let errorMessageElm = document.getElementById("errorMessage") | |
function setErrorDisplay(){ | |
allElemsElm.style.display ="none" | |
errorMessageElm.style.display = "block" | |
} | |
fetch("https://api.apispreadsheets.com/data/9396/").then(res=>{ | |
if (res.status === 200){ | |
res.json().then(data=>{ | |
const yourData = data["data"] | |
let rowInfo = yourData[0] | |
let rowInfoDiv = document.createElement("div") | |
rowInfoDiv.classList.add("elemsRow") | |
let rowWeek = document.createElement("p") | |
let rowWeekNode = document.createTextNode("The week of " + rowInfo["Week"]) | |
rowWeek.appendChild(rowWeekNode) | |
rowWeek.classList.add("Week") | |
let rowShow = document.createElement("p") | |
let rowShowNode = document.createTextNode("I have been binging " + rowInfo["Show"] + ",") | |
rowShow.appendChild(rowShowNode) | |
rowShow.classList.add("Show") | |
let rowMusic = document.createElement("p") | |
let rowMusicNode = document.createTextNode("listening to " + rowInfo["Music"] + ",") | |
rowMusic.appendChild(rowMusicNode) | |
rowMusic.classList.add("Music") | |
let rowLanguage = document.createElement("p") | |
let rowLanguageNode = document.createTextNode(" and practicing up on " + rowInfo["Language"] + "! ") | |
rowLanguage.appendChild(rowLanguageNode) | |
rowLanguage.classList.add("Language") | |
let rowQuote = document.createElement("p") | |
let rowQuoteNode = document.createTextNode("A quote that got to me: ") | |
rowQuote.appendChild(rowQuoteNode) | |
let rowQuoteItalics = document.createElement("i") | |
let rowQuoteItalicsNode = document.createTextNode(rowInfo["Quote"]) | |
rowQuoteItalics.appendChild(rowQuoteItalicsNode) | |
rowQuote.classList.add("Quote") | |
rowQuoteItalics.classList.add("Quote") | |
rowInfoDiv.appendChild(rowWeek) | |
rowInfoDiv.appendChild(rowShow) | |
rowInfoDiv.appendChild(rowMusic) | |
rowInfoDiv.appendChild(rowLanguage) | |
rowInfoDiv.appendChild(rowQuote) | |
rowInfoDiv.appendChild(rowQuoteItalics) | |
allElemsElm.appendChild(rowInfoDiv) | |
allElemsElm.style.display = "block" | |
errorMessageElm.style.display = "none" | |
}).catch(err => { | |
setErrorDisplay() | |
}) | |
} | |
else{ | |
setErrorDisplay() | |
} | |
}).catch(err =>{ | |
setErrorDisplay() | |
}) | |
</script> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment