Ajax (Asynchronous Javascript And XML)란?
Javascript의 라이브러리중 하나이며, Asynchronous Javascript And Xml(비동기식 자바스크립트와 xml)의 약자입니다.
전체 페이지를 새로 고치지 않고, 페이지의 일부분만을 새로 고쳐 데이터를 로드하는 방법입니다.
Ajax는 JavaScript를 사용한 비동기 통신, 클라이언트와 서버간에 데이터를 주고 받는 기술이라고 할 수 있다.(XML뿐만아니라 JSON,JSP,html 데이터도 주고 받을 수 있다.) (비동기적으로 웹 서버와 데이터를 주고 받는 것[비동기 통신]을 말한다)
웹 사이트를 사용하다보면 어떤 요청을 처리할 때 화면이 멈추거나 로딩바가 나오거나, 페이지가 깜빡이는 경우를 볼 수 있다. 이것은 비동기방식이 아닌 '동기'식으로 통신을 하는 경우를 뜻한다. 때문에 서버에 보낸 요청처리하는 동안 잠시 화면이 멈추거나 새로받아온 데이터를 사용하여 화면 전체를 새로고침 한 것이라고 볼 수 있다.
그렇다면 비동기 통신은 무엇일까
비동기 방식으로 통신을 하게 되면, 페이지를 새로고침(reload)하거나 멈추는 현상 없이 서버와 데이터를 주고 받을 수 있다.
비동기의 장점은 페이지 리로드의 경우(동기) 전체 소스데이터를 다시 불러와야하는데 다른 소스데이터(이미지, 파일,기타 코드 등)를 모두 재요청할 경우 불필요한 소스데이터 낭비가 발생하게 된다
비동기식 방식을 이용할 경우 필요한 부분에서만 데이터를 불러와 사용할 수 있는 큰 장점이 있다.
자바스크립트 & 제이쿼리 (jpub) - 8장 Ajax와 JSON | Today Yurim Learned
자바스크립트 & 제이쿼리 (jpub) - 8장 Ajax와 JSON Ajax 언제? 검색어 자동완성 장바구니에 아이템 추가 비동기 동기 처리 모델: 원래 브라우저는 태그를 만나면 스크립트를 로드하고 처리하기 전까지
milooy.github.io
[Ajax] Ajax란 무엇인가?
Ajax란? Ajax는 JavaScript의 라이브러리중 하나이며 Asynchronous Javascript And Xml(비동기식 자바스크립트와 xml)의 약자입니다. 브라우저가 가지고있는 XMLHttpRequest 객체를 이용해서 전체 페이지를..
coding-factory.tistory.com
HUI : 네이버 블로그
당신의 모든 기록을 담는 공간
blog.naver.com
'Web Programming > Script' 카테고리의 다른 글
jQuery / <input> maxlength 입력하면 자동으로 탭 이동 / keyup(),focus() (0) | 2021.06.04 |
---|---|
입력창에 정해진 자릿수를 입력하면 자동으로 다음으로 이동 / maxlength 입력시 .next().focus() (0) | 2021.06.04 |
input type=file 업로드 이미지 미리보기 (0) | 2021.05.17 |