Jquery Refresh Page

How jquery refresh page is not a new question, but it has been so popular in recent years. With the help of jquery, you can make your web pages more interesting and interactive. The jquery refresh page method is a way to reload a current document with jquery without refreshing the browser window. In this article, we will introduce how to use the jquery refresh page and its features that may be useful for you!

Jquery Refresh Page Methods:

The jquery refresh page methods are simple and easy to understand. In addition, jquery has several features that you might find useful for your projects. The following examples show how jQuery can be used in different ways on a single web project. So this article is not only a jquery refresh page guide but also jquery tips and tricks:

location.reload():

The location.reload() method reloads the current web page, which can be done by clicking on your browser’s refresh button or with this handy JavaScript function. The optional true parameter passed to the method forces it to load from the server and ignore cache settings in browsers like Safari that try to keep pages stored locally for a time so they will not needlessly download them again when you visit them often enough during one session of browsing around online.

Syntax:

location.reload(true)

Example:

<!DOCTYPE html>
<html>

<head>
	<title>
		How to refresh a page
		using jQuery?
	</title>
	
	<script src=
		"https://code.jquery.com/jquery-3.3.1.min.js">
	</script>
</head>


<body>
	<h1 style="color: green">
		GeeksforGeeks
	</h1>
	
	<b>
		How to refresh a page
		using jQuery?
	</b>
	
	<p>
		GeeksforGeeks is a computer science
		portal with a huge variety of well
		written and explained computer science
		and programming articles, quizzes
		and interview questions.
	</p>
	
	<button type="button">
		Button to Reload page
	</button>


	<script type="text/javascript">
		$(document).ready(function () {
			$("button").click(function () {
				location.reload(true);
				alert('Reloading Page');
			});
		});
	</script>
</body>
</html>					

history.go(0):

The history.go() method makes navigating the web and browsing through pages a breeze. If you want to go back one page in your browser, just call this function with ‘0’ as an argument for which webpage you would like it to load from the browser’s cache or if there is no cached version of that page on the said device then it will take longer than usual but still be able to provide something other than error codes such as 404s and 500s.

Syntax:

history.go(0);

Example:

<!DOCTYPE html>
<html>


<head>
	<title>
		How to refresh a page
		using jQuery?
	</title>
	
	<script src=
		"https://code.jquery.com/jquery-3.3.1.min.js">
	</script>
</head>


<body>
	<h1 style="color: green">
		GeeksforGeeks
	</h1>
	
	<b>
		How to refresh a page
		using jQuery?
	</b>
	
	<p>
		GeeksforGeeks is a computer science
		portal with a huge variety of well
		written and explained computer science
		and programming articles, quizzes
		and interview questions.
	</p>
	
	<button type="button">
		Button to Reload page
	</button>


	<script type="text/javascript">
		$(document).ready(function () {
			$("button").click(function () {
				history.go(0);
				alert('Reloading Page');
			});
		});
	</script>
</body>


</html>					

These are just simple examples of how to use jQuery to manipulate the DOM.

If you have any questions about this article or want to know more information, please leave your comment in the comments section below!

Conclusion:

We’ve discussed how to use the jquery refresh page and its features that may be useful for you. It’s time now, to wrap up this article on using jquery on web pages. Do you have any other questions about the usage of jquery? Let us know! You can also comment below with your own thoughts or experiences with the topic at hand. Thank you so much for reading our blog post today; we hope it was helpful!

Also Read: jQuery when

Follow us on Facebook

Leave a Comment