Ajax implements automatic page refresh instance parsing and ajax automatic refresh

Source: Internet
Author: User

Ajax implements automatic page refresh instance parsing and ajax automatic refresh

Ajax introduction:

AJAX is "Asynchronous Javascript And XML" (Asynchronous JavaScript And XML), which is a Web page development technology used to create interactive web applications.
AJAX = Asynchronous JavaScript and XML (subset of standard General Markup Language ).

AJAX is a technology used to create fast dynamic web pages.

By performing a small amount of data exchange with the server in the background, AJAX can implement asynchronous updates on webpages. This means that you can update a part of a webpage without reloading the entire webpage.

If you need to update the content of a traditional web page (without AJAX), you must reload the entire web page.

Html section:

<! DOCTYPE html> 

Php page

<? Php $ count = $ _ GET ["count"]; $ count = $ count % 7; switch ($ count) {case 1: $ message = "11111111111111111"; break; case 2: $ message = "22222222222222222"; break; case 3: $ message = "33333333333333333"; break; case 4: $ message = "44444444444444444"; break; case 5: $ message = "55555555555555555"; break; case 6: $ message = "66666666666666666"; break;} $ res = $ message; echo date ("Y-m-d H: i: s "). "

:


Next we will introduce jQuery's implementation of AJAX timed partial page refresh.

From time to time, I need a mechanism to constantly refresh webpages to provide a real-time dashboard. If I can only refresh a part of a specific page, it will be very large. For example, the traffic light on the dashboard shows the system status.

It is easy to use the jQuery JavaScript library to refresh only part of the page. Once we include the jQuery library of our page, we only need one line of JavaScript to get its work:

<script src="/js/jquery-1.3.2.min.js" type="text/javascript"></script> 

So as long as we put this small JS code snippet into our page to refresh everything in the Content ID tag, let's say every 5 seconds:

setInterval(function() {  $("#content").load(location.href+" #content>*","");}, 5000); 

This is it !! Therefore, it is easy to complete some real-time monitoring behaviors, just that line of code. No more strange metadata refresh tag or iframe is a solution in Web applications.

Every 5 seconds, we will refresh the URL with the same content and all elements, resident in the content where the element ID is the content element: content.

Related Article

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.