본문 바로가기
반응형

JS32

13. AJAX와 데이터 처리-1 #1 AJAX의 개념과 사용법 AJAX(Asynchronous JavaScript and XML)는 웹 페이지를 다시 로드하지 않고도 서버로부터 데이터를 가져오거나 서버에 데이터를 보낼 수 있는 기술입니다. 이를 통해 웹 페이지의 사용성과 성능을 향상시킬 수 있습니다. 이번 섹션에서는 AJAX의 개념과 사용법에 대해 알아보겠습니다. AJAX란? AJAX는 비동기적으로 서버와 브라우저가 데이터를 교환할 수 있게 해주는 기술입니다. 이전에는 서버로부터 데이터를 받아오기 위해 웹 페이지를 새로고침해야 했습니다. 그러나 AJAX를 사용하면 서버로부터 데이터를 비동기적으로 받아와서 현재 페이지를 변경하지 않고도 동적으로 화면을 갱신할 수 있습니다. XMLHttpRequest 객체 AJAX를 사용하기 위해선 먼저 .. 2023. 3. 18.
12. DOM과 이벤트 처리-3 #3 이벤트 버블링과 캡처링 이벤트 버블링과 캡처링은 이벤트가 일어난 요소에서 상위 요소로 전파되는 방식을 의미합니다. 이벤트 버블링은 이벤트가 발생한 요소에서 시작하여 부모 요소를 거쳐 최상위 요소까지 이벤트가 전파되는 방식입니다. 즉, 가장 하위 요소에서 이벤트가 시작되어 상위 요소로 이벤트가 전파되는 것입니다. 이벤트 캡처링은 이벤트 버블링과 반대로 최상위 요소에서 시작하여 하위 요소로 이벤트가 전파되는 방식입니다. 즉, 가장 상위 요소에서 이벤트가 시작되어 하위 요소로 이벤트가 전파되는 것입니다. 이벤트 버블링 이벤트 버블링은 이벤트가 발생한 요소에서 시작하여 부모 요소를 거쳐 최상위 요소까지 이벤트가 전파되는 방식입니다. 이벤트 버블링은 DOM 트리의 구조와 일치합니다. 즉, DOM 요소의 가장.. 2023. 3. 18.
11. DOM과 이벤트 처리-2 #3 이벤트의 종류와 처리 방법 이벤트는 웹 개발에서 사용되는 매우 중요한 개념입니다. 이벤트는 HTML 요소나 JavaScript 객체에서 발생하는 일종의 알림이며, 이벤트에 대한 처리를 담당하는 함수를 이벤트 리스너라고 합니다. 이번 포스트에서는 이벤트 종류와 이벤트 리스너 등록에 대해 다루어보겠습니다. 이벤트 종류 웹 브라우저에서는 많은 종류의 이벤트가 발생합니다. 이벤트 종류는 대소문자를 구분하지 않으며, on 접두어를 제외한 이름으로 표기합니다. 대표적인 이벤트 종류는 다음과 같습니다. click: 요소를 클릭할 때 발생 mouseover: 요소 위로 마우스를 움직일 때 발생 keydown: 키를 누를 때 발생 submit: 폼을 제출할 때 발생 load: 문서나 이미지가 로드될 때 발생 이외에.. 2023. 3. 18.
10. DOM과 이벤트 처리-1 #1 DOM의 개념과 사용법 DOM(Document Object Model)은 웹 문서의 구조화된 표현을 제공하며, 자바스크립트를 사용하여 웹 문서를 동적으로 조작할 수 있는 API입니다. DOM을 이용하여 HTML 요소에 접근하고 조작하는 방법을 알아보겠습니다. 요소의 선택 DOM을 이용하여 HTML 요소를 선택하는 방법에는 여러 가지가 있습니다. getElementById getElementById 메서드를 이용하면 id 속성으로 HTML 요소를 선택할 수 있습니다. Hello World! getElementsByClassName getElementsByClassName 메서드를 이용하면 class 속성으로 HTML 요소를 선택할 수 있습니다. Hello World! This is a paragrap.. 2023. 3. 18.
반응형

티스토리툴바