Sometimes, we want to refresh part of page with JavaScript.
In this article, we’ll look at how to refresh part of page with JavaScript.
How to refresh part of page with JavaScript?
To refresh part of page with JavaScript, we can set the innerHTML property of the element we want to update to the content we want to show.
For instance, we write
const url =
"https://server.test-cors.org/server?id=2934825&enable=true&status=200&credentials=false&methods=GET";
async function refresh() {
btn.disabled = true;
dynamicPart.innerHTML = "Loading...";
dynamicPart.innerHTML = await (await fetch(url)).text();
}
to create the refresh function that makes a GET request to the url with fetch.
And then we get the text content from the response and set the innerHTML property of the dynamicPart element to what we want.
The dynamicPart element may be an element like
<div id="dynamicPart">Dynamic part</div>
We can select it with
const dynamicPart = document.getElementById('dynamicPart')
Conclusion
To refresh part of page with JavaScript, we can set the innerHTML property of the element we want to update to the content we want to show.