웹 프로그래밍 (181) 썸네일형 리스트형 [JS] JSON 파싱 예제 JSON(JavaScript Object Notation)을 활용하여 데이터를 출력해보자. 아래에 보이는 형태의 JSON 파일이 있다고 하면, JSON.parse(해당파일) 또는 eval(해당파일)을 사용하면 된다. 그러나, key 값에 싱글쿼테이션이 없다면 JSON.parse() 형태로는 사용할 수 없다. (보통의 JSON 파일은 다 싱글쿼테이션이 있음) 아래는 eval을 통해 JSON을 파싱하고, 반복문을 통해 데이터를 출력하는 예제다. sample.jsp [ { id : 'hong', name : '홍길동' }, { id : 'park', name : '박길동' }, { id : 'kim', name : '김기리보이' } ] jsonData.jsp JSON DATA 예제 파일 httpReqeust... [AJAX] XMLHttpRequest 모듈을 이용한 예제 module.jsp XMLHttpRequest 모듈을 이용한 예제 이름 : 나이 : 주소 : httpRequest.js /** * Ajax와 관련된 함수 집합 */ let httpRequest = null; function getXMLHttpRequest() { if(window.XMLHttpRequest) { return new XMLHttpRequest(); } if(window.ActiveXObject) { return new ActiveXObject("Microsoft.XMLHTTP"); } return null; } function sendProcess(method, url, params, callback) { // 1. request 객체 생성 httpRequest = getXMLHttpReq.. [JS] AJAX 예제(작동 순서) 1. XMLHttpRequest 객체 생성 우선 httpRequest 객체를 생성해야 한다. 1-1) XMLHttpRequest라는 내장 객체가 있으면 해당 객체를 생성한다. 1-2 )아닐 경우에는(익스플로러 8버전 이하) ActiveXObject 객체를 생성한다. // 1. XMLHttpReqeust 객체 생성 let httpRequest = null; if(window.XMLHttpRequest){ // XMLHttpReqeust라는 내장객체가 있으면 생성해라. 요즘 다른 브라우저에는 웬만하면 다 제공한다. httpRequest = new XMLHttpRequest(); } else if (window.ActiveXObject){ // 익스플로러 8버전 이하에는 XMLHttpRequest 내장객체가 .. [JS] 변수 = 함수명 VS 변수 = 함수명() 변수 = 함수명 ==> 변수가 함수의 기능을 쓸 수 있다. 변수 = 함수명() ==> 변수에 함수의 결과값이 저장된다. httpRequest의 onreadystatechange가 callbackFunc 함수의 내용을 가지게 된다. [JS] AJAX란? [동기방식] request 했을 때 서버로부터 response가 와야 다른 일을 할 수 있다. response가 오지 않으면 대기해야한다. 마우스도 움직이지 않는 형태다. 요청하면 깜빡거린다. (네이버를 새로고침 해보자. 전체 화면을 모두 reload 한다.) respone 할 때 부터 까지 보낸다. (HTML + CSS data) 그 안에 포함된 이미지 등을 다 보내야하기 떄문에 약간의 지연시간이 있다. [비동기방식] AJAX : Asynchronous JavaScript and XML. 비동기 방식의 자바스크립트 XML 요청해도 깜빡거리지 않는다. (네이버 지도의 화면을 드래그로 끌어보자) 화면의 일부분만 업데이트 한다. 지도 켜면 전국 지도를 한번에 불러오면 아주 비효율적이니까 -화면의 일부분만 수.. [JSP] form 태그로 파일을 보내는 방법 이런 복잡한 내용을 알지 못해도 get.getParameter 등으로 원하는 파일을 뽑아낼 수 있게 도와주는 라이브러리가 있다. 바로 cos.jar 이다. (cos.jar 내에 있는 MultipartRequest.class가 그 역할을 함) .zip 파일 내에 lib 폴더 내에 cos.jar 가 있다. WEB-INF / lib에 해당 jar 파일을 넣자. cos.jar 내에 있는 MultipartRequest 클래스를 활용하자. 아래의 생성자를 호출하면서 saveFoler 내에 파일이 저장된다. String saveFolder = "D:/workspace/web/web-workspace/Mission-WEB/WebContent/upload"; request.setCharacterEncoding("utf-.. [JS] ★a태그 href 속성에 javascript 함수 넣기 [JSP] 해석 순서( jsp >> javascript ) : JSTL 등의 jsp 코드는 주석처리되어 화면에 안보임 서버사이드에서 먼저 해석하기 때문에 우선 .jsp가 .java로 바뀐다. 이때 JSTL 등의 코드는 주석처리 된다. 그래서 이전 1 2 3 4 5 6 7 ··· 23 다음
