Sun의 정리정돈

[Ajax] Ajax의 개념 본문

FrontEnd/JavaScript

[Ajax] Ajax의 개념

Sunday31 2023. 1. 25. 10:48

 

 

Ajax란?

  • Asynchronous Javascript and XML
    • (XML은 eXtensible markup language의 약자로 HTML을 확장한 마크업언어이다.)
  • 비동기적인 자바스크립트와 xml 통신방식이다.
  • 아래와 네이버 로그인 창의 사진과 같이,  빈칸으로 넘어가려고 하자 텍스트박스 아래에 아이디를 입력해달라는 빨간 색 글씨의 문구가 뜬다.
    • 이렇게 페이지의 이동 없이, 서버에 직접적으로 요청하지 않고 간접적으로 xhr객체를 통해서 요청하여
    • 요청결과를 xhr객체를 통해서 브라우저로 실시간으로 전송을 받는다.

비동기적인 통신방식으로 문구 출력

 


 

Ajax의 4대 구성요소

  1. XMLHttpRequest(=XHR객체)
    웹 서버와의 통신을 담당하는 객체이다.
    client <----(xhr객체)----> server
  2. DOM(Document Object Model) :
    클라이언트의 특정위치에 출력, 문서 구조 등을 담당한다. (웹페이지의 메인화면 부분으로 보면 된다)
  3. CSS :
    화면 디자인 글자색, 배경색 등의 UI 담당한다.

  4. 자바스크립트 :
    이벤트를 연결하고, 사용자의 동작을 감지한다. XMLHttpRequest와 DOM, CSS 사이의 중개 역할도 한다.

'FrontEnd > JavaScript' 카테고리의 다른 글

[Java script] 문법(함수, 제어문)  (0) 2022.11.09
[Java script] 개요  (2) 2022.11.08
Comments