본문 바로가기

Spring/JavaScript+Jsp(HTMl)39

[ jQuery ] load() 사용방법 및 예제 웹 페이지의 내용을 동적으로 교체하기 위해서 Ajax로 서버에서 데이터 json 형식으로 받아 HTML 요소를 생성하여 페이지 내의 원하는 위치의 내용을 바꾸는 작업을 많이 합니다. jQuery의 .load() 메서드는 주어진 URL로부터 HTML 데이터를 받아 jQuery 셀력터로 선택된 위에 넣어 줌으로써 동적으로 페이지의 내용을 교체하는 작업을 간단하게 처리합니다. 그래서 load() 메소드를 사용하는 방법에 대하여 예제와 함께 알아보려 합니다. load() 메서드는 비동기 방식으로 특정 위치에 있는 파일의 객체 또는 문서를 불러올 수 있는 AJAX 메서드입니다.. 이런 비동기 방식은 당연히 ajax()가 매우 익숙한데 이 메서드의 간소화된 비동기 호출의 단축 메서드로 하는 일은 거의 동일합니다. .. 2022. 7. 14.
[jQuery ] ajax - async, complete, beforeSend 설정방법 ajax를 쓰다 보면 async, complete, beforeSend을 사용할 때가 있다. async (default: true) Type: Boolean 기본설정은 비동기(true) 처리이고 동기(false) 처리를 하려면 변경이 필요하다. - 비동기: 로직의 실행이 끝날 때까지 기다려주지 않고 나머지 코드를 먼저 실행하는 것을 말한다. 즉, 순서에 상관없이 실행된다. - 동기: 처리가 된 이후에 다음 로직이 실행된다. 즉, 실행 순서가 있다. complete Type: Function( jqXHR jqXHR, String textStatus ) success, error에 관계없이 실행하고 싶은 로직을 넣는다. finally와 같은 기능을 수행한다. beforeSend Type: Function( .. 2022. 7. 7.
[ JSP ] JSP 주석 처리방법 정리 JSP에서 주석 처리 방법은 3가지가 있다. 1. → JSP주석 (소스 확인 가능) HTML 주석은 출력되는 HTML 코드에 주석을 다는 것으로, 프로그램에 대한 설명을 달기보다는 디자인적인 요소를 설명하는데 주로 사용된다. ※ html 소스 보기에서 확인 가능 2. → HTML주석 (소스 확인 불가능) JSP 주석은 로 끝난다. ※ html 소스 보기에서 확인 불가능 3. // → 자바 주석 자바 주석은 스크립트에서 사용되는 주석으로서, 자바 언어에서 주석으로 처리되는 것들이다. 자바 주석은 다음과 같이 3가지 형태가 있다. ·//주석 내용 : 현재 줄에서 ·/*주석 내용 */ : /*와 */ 사이의 내용을 주석 처리함 ·/** 주석 내용 */ : 선언부에 정의한 메서드를 설명할 때만 사용된다. //현.. 2022. 6. 29.
[Javascript] 자바스크립트에서 Class(클래스) 사용법 자바스크립트에서 클래스(class) 사용은 ES6에서부터 지원을 하기 시작했다. 익스플로러에서는 해당 코드 사용이 불가능하나, 대부분의 최신 브라우저를 이용할 경우 class를 지원한다. 클래스 상속(class inheritance, subclassing) 기능을 통해 한 클래스의 기능을 다른 클래스에서 재사용할 수 있다. 이제 클래스의 기본 사용법에 대해서 알아보자! Class 생성 방법 Javascript 내에서 Class를 생성 방법은 간단하다. class를 선언만 해준다면 class 객체를 바로 만들 수 있다. class Person { } let hong = new Person(); console.log(hong); class로 만들어준 예시인 Person이라는 이름의 객체가 생성된 걸 확인할 .. 2022. 6. 2.
[ JavaScript / Java ] ajax로 배열 값 넘기기 ajax로 배열 값을 넘기는 방법을 알아보자 1. ajax에서 traditional : true 옵션을 넣어주자. 2. 컨트롤러단에서 ArrayList 또는 String[]로 받아서 사용 예제1 //JavaScript var arr = ['aa', 'bb', 'cc']; $.ajax({ method : 'POST', url : 'test.do', traditional : true, //필수 data : { 'main' : arr }, success : function(data) { alert(data); }, error : function(request, status, error) { alert(error); } }); //Java @RequestMapping(value = "/test.do", meth.. 2022. 4. 26.
728x90