Ajax 페이지 자동 새로 고침 인 스 턴 스 분석 실현

Ajax 프로필:
AJAX 는'Asynchronous Javascript And XML'(비동기 JavaScript 와 XML)로 대화 형 웹 애플 리 케 이 션 을 만 드 는 웹 개발 기술 을 말한다.
AJAX=비동기 자 바스 크 립 트 와 XML(표준 통용 표기 언어의 부분 집합).
AJAX 는 빠 른 동적 웹 페이지 를 만 드 는 데 사용 되 는 기술 이다.
배경 에서 서버 와 소량의 데이터 교환 을 통 해 AJAX 는 웹 페이지 를 비동기 로 업데이트 할 수 있다.웹 페이지 전 체 를 다시 불 러 오지 않 고 웹 페이지 의 일부분 을 업데이트 할 수 있다 는 뜻 이다.
전통 적 인 웹 페이지(AJAX 를 사용 하지 않 음)는 콘 텐 츠 를 업데이트 하려 면 웹 페이지 전 체 를 다시 불 러 와 야 한다.
html 부분:

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <title>ajax      </title>
</head>
<body onLoad="Autofresh()">
<p>      :<span id="currenttime"></span></p>
  <script>
    var xmlobj;
    var count=0;
    function createXMLHttpRequest(){
      if(window.ActiveXObject){
        xmlobj=new ActiveXObject("Microsoft.XMLHTTP");
      }
      else if(window.XMLHttpRequest){
        xmlobj=new XMLHttpRequest();
      }
    }
    function Autofresh(){
      createXMLHttpRequest();    
       count=count+1;    
      xmlobj.open("GET","currenttime.php?count="+count,true);
      xmlobj.onreadystatechange=doAjax;
      xmlobj.send("r="+Math.random());//         
    }
    function doAjax(){
      if(xmlobj.readyState==4 && xmlobj.status==200){
        var time_span=document.getElementById('currenttime');
        time_span.innerHTML=xmlobj.responseText;
        setTimeout("Autofresh()",2000);
      }
    }
  </script>
</body>
</html>
php 페이지 부분

<?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")."<hr>"."      :".$res;
 ?>
효과 그림:

다음은 jQuery 가 AJAX 정시 부분 페이지 리 셋 을 실현 하 는 것 을 소개 합 니 다.
때때로 나 는 실시 간 계기판 을 제공 하기 위해 어떤 메커니즘 이 필요 하 다.만약 에 제 가 특정한 페이지 의 일부분 만 새로 고 칠 수 있다 면 이것 은 매우 클 것 입 니 다.예 를 들 어 계기판 의 신호등 은 시스템 상 태 를 표시 합 니 다.
이것 은 jQuery JavaScript 라 이브 러 리 를 사용 하여 페이지 의 일부분 만 새로 고침 하기 쉽다.일단 우리 가 우리 페이지 의 jQuery 라 이브 러 리 에 포함 되면,우 리 는 단지 한 줄 의 JavaScript 로 그것 의 일 을 얻 을 수 있 습 니 다.

<script src="/js/jquery-1.3.2.min.js" type="text/javascript"></script> 
그래서 저 희 는 이 작은 JS 코드 세 션 에 페이지 를 넣 어서 내용 ID 라벨 의 모든 것 을 새로 고치 면 5 초 마다:

setInterval(function() {
  $("#content").load(location.href+" #content>*","");
}, 5000); 
이게 얘 야!!그래서 이것 은 실시 간 으로 감시 하 는 행 위 를 쉽게 완성 할 수 있 고 그 줄 의 코드 일 뿐이다.더 이상 한 메타 리 셋 태그 나 iframe 솔 루 션 이 없습니다.웹 프로그램 에서.
5 초 마다 저 희 는 내용 이 같은 URL 과 모든 요 소 를 새로 고 칩 니 다.요소 ID 가 content 요소 인 내용:내용 에 머 물 러 있 습 니 다.

좋은 웹페이지 즐겨찾기