1. Ajax 기초 문법
https://github.com/upcake/Class_Examples
교육 중에 작성한 예제들은 깃허브에 올려두고 있습니다.
gif 파일은 클릭해서 보는 것이 정확합니다.
- Ajax : Asynchronous JavaScript and XML
- 비동기적 자바스크립트와 XML으로 직역할 수 있다.
- 자바스크립트를 이용해서 비동기적으로 서버와 브라우저가 데이터를 주고받는 방식을 의미한다.
- XML과 JSON 형식을 많이 사용한다.
- Turn to Tern Project 메뉴를 이용해 자동 완성 기능이 되도록 설정한다.
- JQuery에서 제공하는 $.ajax() 메서드를 이용해서 Ajax를 사용한다.
- $.ajax(url, {옵션객체})
- $.ajax({옵션객체}) ▶ 주로 사용
- url : "" ▶ 서버에 요청할 url, 필수 요소
- success : function(result) {}; ▶ Ajax 통신, 서버가 처리한 요청에 성공했을 때 실행되는 콜백 함수
- type : "" ▶ 데이터 전송 타입, get이면 주소창에 보이고 post면 안 보인다.
- data : "" ▶ 요청과 함께 서버로 데이터를 전송할 파라미터(문자열 또는 객체)를 기입한다.
- error: function (request, status, error) {};
▶ Ajax 통신에 실패했을 때 실행되는 콜백함수
▶ request, status, error는 에러 정보를 확인해주는 역할을 한다.
- $.get() ▶ get 방식으로 Ajax 수행
- HTML 태그를 가져와 문서 객체에 출력할 때 load() 메서드를 사용한다.
- $('요소선택').load(url, data, 콜백함수) ▶ data와 콜백함수는 생략 가능하다.
- $.getJSON() 메서드는 JSON 형식 파일을 쉽게 가져올 수 있지만, 잘 사용되지는 않는다고 한다.
- find() 메서드는 : xml 문서 객체에 접근할 때 사용하는 메서드이다.
- serialize() : HTML의 폼 요소에 입력된 데이터를 쿼리 문자열로 바꿔준다.
- dataType : "" ▶ 요청할 데이터의 타입을 선택한다. xml, json, html, script를 선택할 수 있다.
