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.