수업소개
ajax를 구현하는 여러가지 기술이 있습니다. 우리 수업에서는 최신 기술인 fetch API를 이용할 것입니다. fetch API는 기존의 방식에 비해서 더 유연하고, 분명합니다.
fetch API 기본 사용법
소스코드
<!doctype html> <html> <body> <article> </article> <input type="button" value="fetch" onclick=" fetch('html').then(function(response){ response.text().then(function(text){ document.querySelector('article').innerHTML = text; }) }) "> </body> </html>
fetch API의 요청과 응답
fetch API - response 객체
소스코드
<!doctype html> <html> <body> <article> </article> <input type="button" value="fetch" onclick=" /* fetch('html').then(function(response){ response.text().then(function(text){ document.querySelector('article').innerHTML = text; }) }) */ //Asynchronous fetch('html').then(function(response){ if(response.status == '404'){ alert('Not found') } }); console.log(1); console.log(2); "> </body> </html>