jQuery Ajax 회고

이 절 에 저 는 Ajax 에 대한 설명 만 쓰 려 고 합 니 다. 대부분 jQuery 에서 온 도움말 문서 이기 때문에 첫 페이지 에 두 지 마 세 요.첫 페이지 는 시간 과 신경 을 써 야 할 작품 이 라 고 생각 하기 때문에 이번 에는 자기 느낌 이 기준 에 맞지 않 는 다. 하하.코드 프 리 젠 테 이 션 과 jQuery Ajax 의 새로운 것들 은 다음 시간 에 이야기 할 것 입 니 다. 여 기 는 말 하지 않 겠 습 니 다.시간 이 벌써 새벽 이 되 었 다.만약 여러분 이 어떤 jQuery 의 의문 이 있다 고 생각 하거나 Ajax 가 그 내용 을 이야기 해 야 한다 고 생각 하 는 사람 은 모두 저 에 게 메 시 지 를 남 길 수 있 습 니 다. 제 가 시간 과 능력 이 있다 면 최선 을 다 해 여러분 을 만족 시 킬 것 입 니 다.
1. load( url, [data], [callback] )
원 격 HTML 파일 코드 를 불 러 오고 DOM 에 삽입 합 니 다.
기본적으로 GET 방식 을 사용 합 니 다. - 추가 파 라 메 터 를 전달 할 때 POST 방식 으로 자동 으로 전 환 됩 니 다.jQuery 1. 2 에서 불 러 온 HTML 문 서 를 선택 할 수 있 는 선택 자 를 지정 할 수 있 습 니 다. DOM 은 선 택 된 HTML 코드 만 삽입 합 니 다.문법 형 은 "url \ # some > selector" 와 같 습 니 다.
인자:
url (String): 요청 한 HTML 페이지 의 URL 주소 입 니 다.
data (Map) :  서버 에 보 낸 key / value 데이터 입 니 다.
콜백 (Callback): 요청 이 완료 되 었 을 때 (success 가 필요 없 음) 의 리 셋 함수 입 니 다.
방법 은 기본적으로 GET 방식 으로 전 달 됩 니 다. 매개 변수 가 데 이 터 를 전달 하면 자동 으로 POST 방식 으로 전 환 됩 니 다.이 방법 은 HTML 파일 을 동적 으로 불 러 오 는 데 편리 하 다.

  
  
  
  

   
   
   
   
CODE  
   
   
   
   
$("#feeds").load("feeds.php", {limit: 25}, function(){ alert("The last 25 entries in the feed have been loaded"); });   
  
  
  
  

2. jQuery.get( url, [data], [callback] ）
원 격 HTTP GET 를 통 해 정 보 를 불 러 오 기 를 요청 합 니 다.
복잡 한 $. aajax 대신 간단 한 GET 요청 기능 입 니 다. 요청 이 성공 하면 리 셋 함 수 를 호출 할 수 있 습 니 다. 오류 가 발생 했 을 때 함 수 를 실행 하려 면 $. aajax 를 사용 하 십시오.
url (String) :  요청 한 URL 주 소 를 보 냅 니 다.
data (Map): 서버 에 보 낼 데 이 터 는 Key / value 의 키 값 으로 표시 되 며, QueryString 으로 요청 URL 에 추 가 됩 니 다.
callback (Function) :  불 러 오 는 데 성 공 했 을 때 리 셋 함수 입 니 다.

  
  
  
  

   
   
   
   
CODE  
   
   
   
   
$.get("test.cgi", { name: "John", time: "2pm" }, function(data){ alert("Data Loaded: " + data); });   
  
  
  
  

3.jQery.post
( url, [data], [callback], [type] )
원 격 HTTP POST 를 통 해 정 보 를 불 러 오 기 를 요청 합 니 다.
이것 은 복잡 한 $. ajax 대신 간단 한 POST 요청 기능 입 니 다. 요청 이 성공 할 때 리 셋 함 수 를 호출 할 수 있 습 니 다. 오류 가 발생 했 을 때 함 수 를 실행 하려 면 $. ajax 를 사용 하 십시오.
url (String): 요청 한 URL 주 소 를 보 냅 니 다.
data (Map) :  서버 에 보 낼 데 이 터 는 Key / value 의 키 로 표시 합 니 다.
콜백 (Function): 불 러 오 는 데 성 공 했 을 때 리 셋 함수 (Response 의 리 턴 상태 가 success 여야 이 방법 을 호출 할 수 있 습 니 다).
type (String): 클 라 이언 트 가 요청 한 형식 (JSON, XML, Script, Text...)

  
  
  
  

   
   
   
   
CODE  
   
   
   
   
$("#feeds").post("feeds.php", {data: 'data'}, function(){ alert("The last 25 entries in the feed have been loaded"); });   
  
  
  
  

4. jQuery.getScript
( url, [callback] )
HTTP GET 를 통 해 JavaScript 파일 을 불 러 오고 실행 할 것 을 요청 합 니 다.
jQuery 1.2 버 전 이전에 getScript 는 같은 도 메 인 JS 파일 만 호출 할 수 있 습 니 다. 1. 2 에 서 는 도 메 인 을 넘 어 JavaScript 파일 을 호출 할 수 있 습 니 다. 주의: Safari 2 또는 더 빠 른 버 전 은 전체 도 메 인 에서 스 크 립 트 를 동기 화 할 수 없습니다. getScript 를 통 해 스 크 립 트 를 추가 하면 지연 함 수 를 추가 하 십시오.
url (String): JS 파일 주 소 를 불 러 올 때 까지 기다 리 십시오.
callback (Function) :  성공 적 으로 불 러 온 후 리 셋 함수.
방법 은 GET 방식 으로 자 바스 크 립 트 파일 을 불 러 오고 실행 할 것 을 요청 합 니 다.

  
  
  
  

   
   
   
   
CODE  
   
   
   
   
jQuery.getScript("http://dev.jquery.com/view/trunk/plugins/color/jquery.color.js", function(){ $("#go").click(function(){ $(".block").animate( { backgroundColor: 'pink' }, 1000) .animate( { backgroundColor: 'blue' }, 1000); }); });   
  
  
  
  

5：jQuery.getJSON(url,[data],[callback])
HTTP GET 를 통 해 JSON 데 이 터 를 불 러 오 기 를 요청 합 니 다.
jQuery 1. 2 에 서 는 "my url? callback =?" 과 같은 JSONP 형식의 리 셋 함 수 를 사용 하여 다른 네트워크 의 JSON 데 이 터 를 불 러 올 수 있 습 니 다. jQuery 는 리 셋 함 수 를 실행 하기 위해 자동 으로 바 꿉 니 다.
메모: 이 줄 의 다음 코드 는 이 반전 함수 가 실행 되 기 전에 실 행 됩 니 다.
url (String): 요청 주 소 를 보 냅 니 다.
data (Map): (선택 가능) 보 낼 키 / value 인자 입 니 다.
callback (Function): (선택 가능) 불 러 오 는 데 성 공 했 을 때 리 셋 함수 입 니 다.

  
  
  
  

   
   
   
   
CODE   
   
   
   
   
$.getJSON("http://api.flickr.com/services/feeds/photos_public.gne?tags=cat&tagmode=any&format=json&jsoncallback=?", function(data){ $.each(data.items, function(i,item){ $("<img>").attr("src", item.media.m).appendTo("#images"); if ( i == 3 ) return false; }); });   
   
   
   
   
 
  
  
  
  

6:jQuery.ajax(options)
HTTP 를 통 해 원 격 데 이 터 를 불 러 올 것 을 요청 합 니 다.
jQuery 밑바닥 AJAX 구현. 간단 하고 사용 하기 쉬 운 고위 층 구현 은 $. get, $. post 등 을 볼 수 있 습 니 다.
$. ajax () 는 만 든 XML HttpRequest 대상 을 되 돌려 줍 니 다. 대부분의 경우 이 대상 을 직접 조작 할 필요 가 없 지만 특수 한 경우 수 동 으로 요청 을 종료 할 수 있 습 니 다.
$. ajax () 는 매개 변수 key / value 대상 만 있 습 니 다. 각 설정 및 리 셋 함수 정 보 를 포함 합 니 다. 자세 한 매개 변수 옵션 은 다음 과 같 습 니 다.
메모: dataType 옵션 을 지정 했다 면 서버 가 올 바른 MIME 정 보 를 되 돌려 주 는 지 확인 하 십시오. (예 를 들 어 xml 는 "text / xml" 로 되 돌아 갑 니 다.) 잘못된 MIME 형식 은 예측 할 수 없 는 오 류 를 초래 할 수 있 습 니 다. Specifying the Data Type for AJAX Requests 를 보십시오.
메모: dataType 이 "script" 으로 설정 되 어 있 으 면 모든 원 격 (같은 도 메 인 에 없 음) POST 요청 이 GET 요청 으로 전 환 됩 니 다. (DOM 의 script 탭 을 사용 하여 불 러 오기 때 문 입 니 다)
jQuery 1. 2 에 서 는 JSON 데 이 터 를 도 메 인 을 넘 어 불 러 올 수 있 습 니 다. 사용 시 데이터 형식 을 JSONP 로 설정 해 야 합 니 다. JSONP 형식 으로 함 수 를 호출 할 때, 예 를 들 어 "my url? callback =?" jQuery 는 자동 으로 바 꿉 니 다. 정확 한 함수 이름 으로 리 셋 함 수 를 실행 합 니 다. 데이터 형식 을 "jsonp" 로 설정 할 때 jQuery 는 자동 으로 리 셋 함 수 를 호출 합 니 다.
인자:
async (Boolean): (기본 값: true) 기본 설정 에서 모든 요청 은 비동기 요청 입 니 다. 동기 요청 을 보 내 려 면 false 로 설정 하 십시오. 동기 요청 은 브 라 우 저 를 잠 그 고 사용자 의 다른 작업 은 요청 이 완료 되 기 를 기 다 려 야 실행 할 수 있 습 니 다.
beforeSend (Function): 요청 을 보 내기 전에 사용자 정의 HTTP 헤드 를 추가 하 는 등 XML HttpRequest 대상 의 함 수 를 수정 할 수 있 습 니 다. XML HttpRequest 대상 은 유일한 인자 입 니 다. Ajax 이벤트.
cache (Boolean): (기본 값: true, dataType 이 script 일 때 기본 값 은 false) jQuery 1.2 새 기능 입 니 다. false 로 설정 하면 브 라 우 저 캐 시 에서 요청 정 보 를 불 러 오지 않 습 니 다.
complete (Function): 요청 완료 후 리 셋 함수 (요청 이 성공 하거나 실 패 했 을 때 모두 호출 됨). 인자: XML HttpRequest 대상 과 성공 요청 형식 을 설명 하 는 문자열 입 니 다. Ajax 이벤트.
contentType (String): (기본 값: "application / x - www - form - urlencoded") 서버 에 메 시 지 를 보 낼 때 내용 인 코딩 형식 입 니 다. 기본 값 은 대부분의 응용 프로그램 에 적합 합 니 다.
data (Object, String): 서버 에 전 송 된 데이터 입 니 다. 요청 문자열 형식 으로 자동 변 환 됩 니 다. GET 요청 은 URL 뒤에 추 가 됩 니 다. processData 옵션 설명 을 보면 자동 으로 변환 되 지 않 습 니 다. Key / Value 형식 이 어야 합 니 다. 배열 이 라면 jQuery 는 자동 으로 다른 값 으로 같은 이름 에 대응 합 니 다. 예 를 들 어 {foo: ["bar 1", "bar 2"]} 을 '& foo = bar 1 & foo = bar 2' 로 변환 합 니 다.
dataFilter (Function): Ajax 에 게 되 돌아 오 는 원본 데 이 터 를 미리 처리 하 는 함수 입 니 다. data 와 type 두 개의 인 자 를 제공 합 니 다. data 는 Ajax 가 되 돌아 오 는 원본 데이터 이 고 type 은 jQuery. ajax 를 호출 할 때 제공 하 는 dataType 인자 입 니 다. 함수 가 되 돌아 오 는 값 은 jQuery 가 더 처리 합 니 다.
dataType (String): 서버 가 되 돌아 올 것 으로 예상 되 는 데이터 형식 입 니 다. 지정 하지 않 으 면 jQuery 는 HTTP 패키지 MIME 정보 에 따라 responseXML 또는 responseText 를 자동 으로 되 돌려 주 고 리 셋 함수 매개 변수 로 전 달 됩 니 다. 사용 가능 한 값:
"xml": XML 문 서 를 되 돌려 줍 니 다. jQuery 로 처리 할 수 있 습 니 다.
"html": 텍스트 HTML 정 보 를 되 돌려 줍 니 다. script 요 소 를 포함 합 니 다.
"script": 텍스트 자 바스 크 립 트 코드 를 되 돌려 줍 니 다. 결 과 를 자동 으로 캐 시 하지 않 습 니 다. "cache" 인자 가 설정 되 어 있 지 않 은 한.
"json": JSON 데 이 터 를 되 돌려 줍 니 다.
"jsonp": JSONP 형식 입 니 다. JSONP 형식 으로 함 수 를 호출 할 때, 예 를 들 어 "myurl? callback =?" jQuery 는 자동 으로 바 꿉 니 다. 정확 한 함수 이름 으로 리 셋 함 수 를 실행 합 니 다.
"text": 일반 텍스트 문자열 을 되 돌려 줍 니 다.
error (Function): (기본 값: (xml 또는 html) 요청 이 실 패 했 을 때 시간 을 호출 합 니 다. 인자: XML HttpRequest 대상, 오류 정보, (선택 가능) 캡 처 된 오류 대상. Ajax 이벤트.
global (Boolean): (기본 값: true) 전역 AJAX 이 벤트 를 실행 할 지 여부 입 니 다. false 로 설정 하면 전역 AJAX 이 벤트 를 실행 하지 않 습 니 다. 예 를 들 어 ajax Start 나 ajax Stop 은 서로 다른 Ajax 이 벤트 를 제어 할 수 있 습 니 다.
ifModified (Boolean): (기본 값: false) 서버 데이터 가 변 경 될 때 만 새 데 이 터 를 가 져 옵 니 다. HTTP 패키지 Last - Modified 헤더 정 보 를 사용 하여 판단 합 니 다.
jsonp (String): jsonp 요청 에서 리 셋 함수 의 이름 을 다시 씁 니 다. 이 값 은 "callback =?" 와 같은 GET 나 POST 요청 의 URL 인자 에 있 는 "callback" 부분 을 대체 합 니 다. 예 를 들 어 {jsonp: "onJSonPLoad"} 은 "onJSonPLoad =?" 를 서버 에 전달 합 니 다.
password (String): HTTP 접근 인증 요청 에 응답 하 는 암호
processData (Boolean): (기본 값: true) 기본 값 으로 보 내 는 데 이 터 는 대상 으로 전 환 됩 니 다 (기술적 으로 문자열 이 아 닙 니 다). 기본 내용 형식 인 'application / x - www - form - urlencoded' 에 맞 춰 보 냅 니 다. DOM 트 리 정보 나 다른 바 꾸 기 싫 은 정 보 를 보 내 려 면 false 로 설정 하 십시오.
scriptCharset (String): 요청 할 때 만 dataType 이 "jsonp" 또는 "script" 이 고 type 이 "GET" 일 때 만 charset 를 강제로 수정 할 수 있 습 니 다. 로 컬 과 원 격 콘 텐 츠 인 코딩 은 동시에 사용 되 지 않 습 니 다.
success (Function): 성공 후 리 셋 함 수 를 요청 합 니 다. 인자: 서버 가 데이터, 데이터 형식 을 되 돌려 줍 니 다. Ajax 이벤트.
timeout (Number): 요청 시간 초과 (밀리초) 를 설정 합 니 다. 이 설정 은 전역 설정 을 덮어 씁 니 다.
type (String): (기본 값: "GET") 요청 방식 ("POST" 또는 "GET"), 기본 값 은 "GET" 입 니 다. 주의: PUT 와 DELETE 같은 다른 HTTP 요청 방법 도 사용 할 수 있 지만 일부 브 라 우 저 만 지원 합 니 다.
url (String): (기본 값: 현재 페이지 주소) 요청 한 주 소 를 보 냅 니 다.
username (String): HTTP 접근 인증 요청 에 응답 할 사용자 이름

  
  
  
  

   
   
   
   
CODE  
   
   
   
   
$.ajax({ url: "test.html", cache: false, success: function(html){ $("#results").append(html); } });   
  
  
  
  

본 블 로그 에는 같은 종류의 글 이 있 습 니 다.