Friday , 22 September 2017

How to Refresh DIV Without Reloading Page Using jQuery

Refresh DIV Without Reloading Page Using jQuery

This article will help you to understand the power of jQuery (library of JavaScript functions), we use jQuery to make brilliant web apps in short time, this programming language helps us to write code faster than JavaScript so I decided to share my basic knowledge about jQuery with you as much as I can in the previous post I talked about sending data without reloading page but in this article I am going to talk about refresh DIV without reloading page with jQuery and we can use this simple technique to make very basic chat application, I will also write about it soon but now it’s time to learn something useful.

Refresh DIV Without Reloading Page

As I have already described that what do we need to run or execute jQuery code if you do not know how to run it then read my previous article where I have briefly discussed about adding jQuery source file to use all jQuery functionality so right now I’ll just share the code with you and I’ll talk about how it works.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
<html>
	<head>
		<title>Refresh Div Using jQuery</title>
		<script src="jquery.js"></script>
		<script>
			$(document).ready(function() {
				setInterval(function() {
					$('#show').text('I showed up after 5 seconds!');
				}, 5000);
			});
		</script>
	</head>
<body>
	<div id="show"></div>
</body>
</html>

Now as you can clearly see in the code that on line number 7-9 that I’ve used a function to refresh DIV without reloading page and on line number 14 I have added a DIV tag with exact same id as I used in jQuery function and we use that function to refresh any DIV in regular interval of time as you can see line number 9 I have put 5000 it means 5 seconds so you can put here 7000 to refresh the selected DIV tag in every 7 seconds right after the page opens for the first time it will keep refreshing the DIV every 7 seconds until we’ll close the page so as I told you we can use it to make very simple chat application and I will definitely share that post very soon and thanks if you read this post God bless you.

Leave a Reply