ajax 장단 점 작업 원리

장점:
1. 업데이트 데이터 새로 고침 없 음
Ajax 의 가장 큰 장점 은 전체 페이지 를 새로 고치 지 않 고 서버 와 의 통신 을 유지 할 수 있다 는 것 이다.
2. 비동기 및 서버 통신
비동기 방식 으로 서버 와 통신 하여 사용자 의 조작 을 끊 지 않 습 니 다.
단점:
1. Ajax 는 Back 과 History 기능, 즉 브 라 우 저 메커니즘 에 대한 파 괴 를 제거 했다.
동적 으로 페이지 를 업데이트 하 는 상황 에서 사용 자 는 이전 페이지 의 상태 로 돌아 갈 수 없습니다. 브 라 우 저 는 과거 기록 의 정적 페이지 만 기억 할 수 있 기 때 문 입 니 다.
2. 안전 문제
AJAX 기술 은 사용자 에 게 좋 은 사용자 체험 을 가 져 다 주 는 동시에 IT 기업 에 새로운 안전 위협 을 가 져 왔 다. Ajax 기술 은 기업 데이터 에 직접적인 통 로 를 구축 하 는 것 과 같다.이 때문에 개발 자 들 은 무심코 이전 보다 더 많은 데이터 와 서버 논 리 를 노출 할 수 있 습 니 다.
3. 검색엔진 에 대한 지원 이 약 함
4. 프로그램의 이상 처리 메커니즘 파괴
5. URL 과 자원 포 지 셔 닝 의 취지 에 위배
6. 모 바 일 장 치 를 잘 지원 하지 못 함
7. 클 라 이언 트 가 비대 하고 너무 많은 클 라 이언 트 코드 가 개발 상의 원 가 를 초래한다.
작업 원리:
Ajax 의 원 리 는 쉽게 말 하면 XmlHttpRequest 대상 을 통 해 서버 에 비동기 요청 을 하고 서버 에서 데 이 터 를 얻 은 다음 javascript 으로 DOM 을 조작 하여 페이지 를 업데이트 합 니 다.그 중 가장 중요 한 단 계 는 서버 에서 요청 데 이 터 를 얻 는 것 이다.이 과정 과 원 리 를 분명히 하려 면, 우 리 는 반드시 옳다. XML Http Request 에 대해 알 고 있 습 니 다.
XML HttpRequest 는 ajax 의 핵심 메커니즘 으로 IE5 에서 먼저 도 입 된 비동기 요청 을 지원 하 는 기술 입 니 다.쉽게 말 하면 자 바스 크 립 트 는 사용 자 를 막 지 않 고 서버 에 요청 과 처리 응답 을 할 수 있 습 니 다.리 셋 효과 가 없습니다.
  그래서 우 리 는 먼저 XML HttpRequest 부터 그것 의 작업 원 리 를 살 펴 보 자.
  우선 XML HttpRequest 라 는 대상 의 속성 을 살 펴 보 겠 습 니 다.
  그것 의 속성 은:
  　　onreadystatechange  트리거 이벤트 의 이벤트 처리 프로그램 을 상태 가 바 뀔 때마다
  　　responseText     서버 프로 세 스에 서 데 이 터 를 되 돌려 주 는 문자열 형식 입 니 다.
  　　responseXML    서버 프로 세 스에 서 되 돌아 오 는 DOM 호 환 문서 데이터 대상 입 니 다.
  　　status           서버 에서 돌아 오 는 디지털 코드, 예 를 들 어 흔히 볼 수 있 는 404 (찾 을 수 없 음) 와 200 (준비 되 었 음)
  　　status Text       상태 코드 에 따 른 문자열 정보
  　　readyState       대상 상태 값
0 (초기 화 되 지 않 음) 대상 이 만 들 어 졌 지만 초기 화 되 지 않 았 습 니 다 (open 방법 이 호출 되 지 않 았 습 니 다)
1 (초기 화) 대상 이 생 성 되 었 습 니 다. send 방법 이 호출 되 지 않 았 습 니 다.
2 (데 이 터 를 보 내 는) send 방법 이 호출 되 었 으 나 현재 상태 및 http 헤드 는 알 수 없습니다.
3 (데이터 전송 중) 응답 및 http 헤더 가 불완전 하기 때문에 일부 데 이 터 를 받 았 습 니 다. 이 때 responseBody 와 responseText 를 통 해 일부 데 이 터 를 가 져 오 는 중 오류 가 발생 할 수 있 습 니 다.
4 (완성) 데이터 수신 이 완료 되 었 습 니 다. 이 때 responseXml 와 responseText 를 통 해 완전한 응답 데 이 터 를 얻 을 수 있 습 니 다.
 
단, 브 라 우 저 마다 차이 가 있 기 때문에 XML HttpRequest 대상 을 만 드 는 데 는 다른 방법 이 필요 할 수 있 습 니 다.이 차 이 는 주로 IE 와 다른 브 라 우 저 사이 에 나타난다.다음은 비교적 표준적 인 XML HttpRequest 대상 을 만 드 는 방법 입 니 다.

function CreateXmlHttp() {

    // IE     XmlHttpRequest  
    if (window.XmlHttpRequest) {
        xmlhttp = new XmlHttpRequest();
    }

    //IE     XmlHttpRequest  
    if (window.ActiveXObject) {
        try {
            xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
        }
        catch (e) {
            try {
                xmlhttp = new ActiveXObject("msxml2.XMLHTTP");
            }
            catch (ex) { }
        }
    }
}

function Ustbwuyi() {

    var data = document.getElementById("username").value;
    CreateXmlHttp();
    if (!xmlhttp) {
        alert("  xmlhttp    ！");
        return false;
    }

    xmlhttp.open("POST", url, false);

    xmlhttp.onreadystatechange = function () {
        if (xmlhttp.readyState == 4) {
            document.getElementById("user1").innerHTML = "      ...";
            if (xmlhttp.status == 200) {
                document.write(xmlhttp.responseText);
            }
        }
    }
    xmlhttp.send();
}