Categories
JavaScript Answers

How to refresh part of page with JavaScript?

Spread the love

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.

By John Au-Yeung

Web developer specializing in React, Vue, and front end development.

Leave a Reply

Your email address will not be published. Required fields are marked *