본문 바로가기

전체 글152

JSP 문장 구성요소( 지시자, 스크립트릿, 표현식 등) jsp 문장 구성요소 jsp에서 HTML / CSS / JavaScript 이외에도 자바 문법을 사용할 수 있다. 자바 문법을 사용하면, jsp에서 컨트롤러나 서블릿 통해 전달 받은 리스트(정보배열)을 for(반복문)을 통해 정보를 뿌릴수도 있다. 지시자 jsp를 수행하기 전에 선행 처리 되어야 할 내용을 기술 지시자 page : 자바처럼 임폴트 할 때 사용 include : 이미 있는 다른 jsp를 현재의 문서에 포함 시킬 때 사용 지시자 include로 문서를 포함해서 불러오는 경우 별도의 servlet 페이지가 생성되지 않는다. 액션태그 로 쓰면 포함된 문서가 별도의 servlet 페이지가 생성된다. 스크립트릿 온갖 자바 문장이 올 수 있고, jsp 안에 여러 번 올 수 있음 하지만, jsp에서 쓰.. 2019. 5. 18.
JSP에서 중요한 get / post 방식 요청 프로그램을 만들다 보면 데이터를 어떻게 전달하는지를 명확히 알고 있어야 프로그램 개발이 가능하다. 특히 그 중에서도 가장 기본적인 부분 중 하나가 클라이언트 요청 방식인 get 과 post 방식! JSP 뿐만 아니라 파이썬, node.js 등으로 프로그래밍을 하는 경우에도 get과 post 방식을 잘 알고 있어야 프로그램을 수월하게 만들 수 있다. 일반적인 프로그램의 경우 DB와 연동하여 사용하기 때문에 적절한 데이터를 넘겨서 원하는 정보를 찾고, 사용자의 입력 정보를 DB에 저장하는 등 데이터 전송, 요청에 대한 부분은 명확히 정리를 해 놓아야 한다. 웹 어플리케이션 동작 방식 클라이언트가 서버에 요청을 하고 응답을 받는 형태로 동작 된다 요청을 하는 객체가 request 요청을 하는 방식은 2개가 있.. 2019. 5. 18.
JSP란 무엇인가? 서블릿은? 서블릿과 JSP 웹 프로그래밍 언어 jsp/서블릿 : 자바 언어를 기반으로 웹에서 동작하는 프로그래밍 기술 서블릿이 먼저 나온 기술 서블릿으로는 웹 문서 만들기가 어려워서 jsp는 나중에 쉽게 웹문서를 만들도록 만들어진 기술 동적인 HTML을 생성 사용자 요구에 따른 HTML을 프로그램에 의해서 생성 동적인 HTML 가능 종류 : jsp, asp, php, python(flask, django…) 서블릿 servlet server와 Applet의 합성어, 서버에서 실행되는 Applet, 자바를 이용하여 웹에서 실행되는 프로그램을 작성하는 기술 서블릿은 자바 클래스 형태의 웹 어플리케이션, HttpServlet 클래스를 상속받은 클래스가 서블릿 HttpServlet은 웹 서비스가 가능한 웹 어플리케이션을 .. 2019. 5. 18.
jQuery 예제, To Do List & 학생 점수 입력 테이블 To Do List 만들기 정보를 입력 받아서 List 형태로 추가하기 아주 간단한 제이쿼리 구현 기능 input으로 값을 입력 받고, 해당 값을 에 추가 Please enter your to do! ADD To Do List ㅇ 사용자 화면 학생 점수 입력 받아 출력하는 테이블 만들기 하나가 아닌 여러개의 input으로 값을 입력 받아서 테이블에 정보를 추가하는 기능 받아온 여러개의 정보를 태그로 한줄 한줄 테이블에 append 하는 기능 이름 국어 영어 수학 등록 시험 점수 이름국어영어수학 ㅇ 사용자 화면 2019. 5. 14.
동일 예제 JavaScript VS jQuery 비교! 학생의 성적을 가지고, 총점과 평균을 구해서 테이블로 보여주는 코드 구현 자바스크립트와 제이쿼리를 사용하여 동일한 예제를 구현 하는 두개의 차이점을 명확하게 알 수 있다. 제이쿼리의 경우 자바스크립트의 비해 조금 더 쉽게, 짧은 코드로 구현이 가능하게 해준다. 아래와 같은 배열을 활용하여 테이블을 만드는 예제 var arr = []; arr.push({name:"박자바",kor:100,eng:100,math:95}); arr.push({name:"김파이",kor:80,eng:75,math:100}); arr.push({name:"홍코드",kor:95,eng:90,math:87}); 자바스크립트 코드 출력 이름 총점 평균 제이쿼리 코드 출력 이름 총점 평균 2019. 5. 14.
jQuery 예제, 버튼 이벤트로 정보 숨기고 보이기(토글) 사용자가 버튼을 클릭하는 경우 페이지를 동적으로 변경하는 경우가 많다. 그런 경우에 토클을 사용하면 보여지고 보여지지 않고가 순차적으로 처리된다. 좋아요 기능 같은 것을 구현할 때 하트를 클릭하면 색이 변하고, 채워진 하트를 클릭하면 다시 빈 하트가 되게 하는 것 등이 토클로 가능하다. 코드 : 토클 기능 코드 - 참고로 토글의 경우 제이쿼리 버전에 따라 제대로 실행이 안되는 경우가 있으니 참고! Open & Close HTML5 Tutorial With HTML you can create your own Website. This tutorial teaches you everything about HTML. HTML is easy to learn - You will enjoy it. Open & Clos.. 2019. 5. 14.
jQuery 예제, 체크박스 모두 선택 설문을 받거나 회원 가입을 하는 경우 사용자의 정보를 알기 위해서 체크박스를 사용하는 경우가 있다 이런 경우에 사용자 입장에서 모든 것을 선택하고 모든 선택을 해제해야 하는 경우가 있는데 이런 것을 제이쿼리로 구현이 가능하다. 간단하게 구현 가능한 기능. 코드 : 체크박스 모두 선택 취미 모두 책읽기 영화보기 노래듣기 요리하기 게임하기 결과 : 사용자 HTML ㅇ 모두라는 체크박스를 클릭하면 전체 선택이 되고, 전체 해제가 되는 기능 2019. 5. 14.
제이쿼리로 이미지 슬라이더 구현 이미지가 넘어가도록 동작하는 것, 플래시를 이용해서 많이 했지만, 무거워서 잘 사용하지 않고 자바스크립트를 활용해서 보통 쓴다. 자바스크립트를 사용해서 플래시나 실버라이트의 시각적 효과를 구현하려면 다음 세가지 사항을 CSS로 미리 지정해야 한다. 캔버스의 width 스타일 속성과 height 스타일 속성은 반드시 지정 캔버스의 position 스타일 속성은 Relative로 지정 캔버스의 overflow 스타일 속성은 hidden으로 지정 구성요소의 position 스타일 속성은 Absolute로 지정 이미지 슬라이더 코드 Trip Photo 오사카 휴식을 위해 떠나고 싶은 곳, 탐색 유럽 유럽의 분위기는 파리! 휴양지 휴식을 위해 떠나고 싶은 곳, 탐색 세부 휴식을 위해 떠나고 싶은 곳, 탐색 오키나.. 2019. 5. 14.
jQuery 애니메이션 큐 (이벤트 누적 제어) 제이쿼리를 통해 애니메이션을 주다보면 이벤트 발생되는 것에 따라 애니메이션이 누적되어 사용자는 다른 작업을 하고 싶은데 누적된 애니메이션을 확인하고 있어야하는 상황이 발생하기도 한다. 이러한 것을 알기 위해서는 애니메이션 큐에 대해서 알고 있어야 한다. 참고로 큐는 순차적으로 이벤트가 누적되어 누적된 순서대로 처리가 되는 자료구조이다. [Java/Java Basic] - 자료구조, Stack 스택과 큐 Queue 자료구조, Stack 스택과 큐 Queue 프로그램 개발할 때 가장 많이 사용하는 자료 구조인 스택과 큐 스택은 상자를 쌓아 올리는 형태의 구조이고, 큐는 일상 생활에서 많이 사용하는 방식의 자료 구조 '선착순' 정보처리기사 필기에도 자주 기출문제.. developsd.tistory.com 애니.. 2019. 5. 14.
jQuery 이벤트 메소드 제이쿼리를 사용하면 이벤트에 대한 제어를 많이 하게 된다. 사용자가 마우스를 올리거나, 타이핑을 하는 경우에 DB의 정보를 가져오거나, 특정 노드를 추가하거나, CSS를 변경하는 등 이러한 것이 제이쿼리를 통해 가능하기 때문에 이벤트를 어떻게 발생시키고, 삭제 하는지 제어하는 방법에 익숙해 지는 것이 좋다. 이벤트 연결 제거 unbind( ) / one( ) one( ) : 딱 한번만 연결하게 하는 것 unbind( ) 메서드 사용 방법 $(선택자).unbind( ) $(선택자).unbind( eventName ) $(선택자).unbind( eventName, function ) hover( ) mouseenter 이벤트와 mouseleave 이벤트를 동시에 연결 제이쿼리가 아닌 css로도 처리 가능하여.. 2019. 5. 14.
jQuery, 특정 태그 선택 후 값 처리 선택자 기본적으로 자바스크립트, 제이쿼리를 하다보면 가장 많이 사용하게 되는 것이 특정 태그를 선택하여 값을 가져오거나 값을 넣는 것을 많이 하게 된다. 특정 태그를 선택할 수 있어야, 해당 태그의 CSS를 변경하거나 특정 노드를 더 추가하는 것도 가능하다. 고정된 HTML을 변경시키면서 사용자가 편리하게 사용할 수 있도록 하는 것이 자바스크립트와 제이쿼리를 많이 사용하는 이유중 하나이기 때문에 가장 잘 알고 있어야 하는 것 중 하나가 선택자를 잘 다루는 것! 전체선택자 : * $(function( ) { $( ' * ' ).css('color','red'); }); 태그선택자 : '태그명' $( ' h1' ).css('color','red'); 클래스선택자 : '.클래스명' $( ' .c' ).css(.. 2019. 5. 14.
jQuery, 제이쿼리 기본 메소드 총정리 이벤트 발생 마우스 클릭 이벤트 : $(선택자).click( function( ){ }); 마우스 더블 클릭 이벤트 : $(선택자).dblclick( function( ){ }); this 자신을 지칭하는 것 $(this).html() 이라고 쓰면, 자신의 html 값을 가져오라는 것. 선택자 전체선택자 : * $(function( ) { $( ' * ' ).css('color','blue'); }); 태그선택자 : '태그명' $( ' h1' ).css('color','blue'); 클래스선택자 : '.클래스명' $( ' .j' ).css('color','blue'); 두가지 클래스를 모두 가지는 태그 선택 $( ' .j.select' ).css('color','blue'); 아이디선택자 : '#아이디명.. 2019. 5. 14.
반응형

티스토리툴바