프론트엔드/Ajax, xml, json(3)
-
Ajax : Method
기본 $.ajax(option) $.ajax(url, option) $.ajax({ url: "", type: "", dataType: "", data: "", success: function(data) { } }) * option 1. url : 불러올 파일명 2. type : get, post 방식 3. dataType : 불러올 파일의 종류(txt,html,xml,json,script) 4. data : 데이터 5. success : 데어터가 성공적으로 불려왔을때 실행할 메서드 6. async : 동기, 비동식 방식 지정( * Ajax를 사용하는 이유 ) $(function(){ $(".btn").on("click",function(){ $.ajax("02-load-html.html") .done(..
2021.02.05 -
Ajax: 개요
AJAX (Asynchronous Javascript And Xml) 비동기식 자바스크립트와 xml. xml 객체를 이용하여 페이지의 일부만 수정하여 전체를 새로 고치지 않아도 일부만 로드할 수 있다. * 비동기 방식 : 웹페이지를 전체 리로드하지 않고 데이터를 불러오는 방식 데이터 형태 1. TEXT.txt 2. HTML.html 3. XML.xml 4. JSON.json 5. script.js 6. php, asp, java 장,단점 장점 1. 웹페이지의 속도향상 2. 서버의 처리가 완료될 때까지 기다리지 않고 처리가 가능하다. 3. 서버에서 Data만 전송하면 되므로 전체적인 코딩의 양이 줄어든다. 4. 기존 웹에서는 불가능했던 다양한 UI를 가능하게 해준다. ( Flickr의 경우, 사진의 제목이..
2021.02.05 -
XML, JSON
XML Extensible Markup language html와 매우 흡사한 마크업 언어, 데이터를 저장하고 전달할 목적. 예제 과일 귤 100000 야채 배추 3000 JSON 자바스크립트에서 파생. 유연하게 정보를 저장, 구조화 할 수 있다. 자바스크립트 구문 형식을 따른다. 역시 변수 이름은 한글이 아닌 영문자로 사용할 것. { "변수명":"데이터", "변수명":[ "값1", "값2", "값3" ], "변수명":{ "변수":데이터1, "변수":데이터2, "변수":데이터3 } } { "변수명":"데이터", "배열명":[ "값1", "값2", "값3" ], "다중배열":{ "변수":"데이터", "변수":"데이터", "변수":"데이터" } } 예제 { "name":"홍길동", "age":18, "gen..
2021.02.05