9. JSP 기초 종합 예제

2022. 7. 9. 16:28·Java Spring/JSP와 스프링


JSP의 기본 구성요소인 지시어와 주석, 스크립트 요소를 실습해보며 익숙해지기 위한 종합예제이다.

이글에선 다음 요소를 다룬다.

  • 주석
  • 선언과 참조
  • include 지시어
  • 스크립트릿

1️⃣ JSP 생성

webapp 우클릭 후 ch06 폴더를 생성한 다음 JSP 파일을 생성해주자.

생성이름은 jspTotal 이다.

생성된 코드는 아래와 같다.

<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>Title</title>
</head>
<body>

</body>
</html>
 주석 작성

<body> 내부에 아래의 코드를 작성해주자.

<h3>
    <!-- HTML 주석 : 화면에서 안보이고 소스보기엔 보임-->
    <%-- JSP 주석 : 화면과 소스보기에서 보이지 않음--%>
</h3>
선언과 참조

일반변수 선언은 스크립트릿에서 가능하지만 

멤버 변수 / 함수 선언은 스크립트릿에서 불가능하다.

따라서 선언문을 이용해 배열과 함수를 선언하자.

 

일단 <body> 태그의 위에서 작성한 <h3>위에 아래의 코드를 작성해주자.

<%!
String[] members = {"김길동", "홍길동", "김사랑", "박사랑"};
int num1 = 10;

int calc(int num2) {
    return num1+num2;
}
%>
  • 배열로 4명의 이름 저장.
  • num1 변수를 10으로 초기화.
  • calc() 메서드는 인자로 받은 숫자를 num1과 더해서 결과 리턴

선언된 코드는 다음과 같이 본문의 표현식 / 스크립트릿 등에서 자유롭게 사용가능하다.

스크립트릿을 활용하여 calc()메서드를 호출한다.

 

아래의 코드를 <h3>태그의 아래부분에 작성해주자.

<h3>
    2. calc(10) 메서드 실행 결과 :
    <%=calc(10)%>
</h3>
<hr>
include 지시어

테스트를 위해 예전글에서 작성했던 hello.jsp를 포함해보자. 이후에도 다른 파일을 포함시킬수 있으니 잘봐두길 바란다.

 

파일의 위치와 경로를 작성할때 주의해야한다. 현재 코드 위치는 ch06폴더에 있고,

hello.jsp는 webapp폴더 바로 아래에 있기 때문에 상대 경로로 위치를 표핸해주어야 한다.

바로 위에서 작성한 코드의 <hr> 아래에 아래 코드를 작성해주자.

<h3>3. include: hello.jsp</h3>
<%@include file="../hello.jsp"%>
스크립트릿

스크립트릿 요소를 사용해 자바의 for문으로 앞에서 선언한 members 배열의 값을 모두 출력해보자.

이름 출력 부분에 out.println()을 사용하지 않기 위해

for문 중간에 닫고 스크립트 요소를 사용한후

다시 for문을 닫는 코드 형식으로 구현하자.

 

다음 코드를 위에서 작성한코드 아래에 작성해주자.

<h3>4. 스크립트(배열 데이터 출력)</h3>
<ul>
    <%
        for(String name : members) {
    %>
        <li><%=name%></li>
    <%
        }
    %>
</ul>

2️⃣ 실행 및 결과 확인

최종 코드는 다음과 같다. 

<%@ page contentType="text/html;charset=UTF-8" language="java" pageEncoding="UTF-8" %>
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>JSP 종합 예제</title>
</head>
<body>
    <h2>JSP 종합 예제</h2>
    <hr>
    <%!
    String[] members = {"김길동", "홍길동", "김사랑", "박사랑"};
    int num1 = 10;

    int calc(int num2) {
        return num1+num2;
    }
    %>
    <h3>
        <!-- HTML 주석 : 화면에서 안보이고 소스보기엔 보임-->
        <%-- JSP 주석 : 화면과 소스보기에서 보이지 않음--%>
    </h3>
    <h3>
        2. calc(10) 메서드 실행 결과 :
        <%=calc(10)%>
    </h3>
    <hr>
    <h3>3. include: hello.jsp</h3>
    <%@include file="../hello.jsp"%>
    <h3>4. 스크립트(배열 데이터 출력)</h3>
    <ul>
        <%
            for(String name : members) {
        %>
            <li><%=name%></li>
        <%
            }
        %>
    </ul>
</body>
</html>

 

마지막으로 톰캣 서버를 실행시킨후 화면을 확인해보자.

http://localhost:8081/ch06/jspTotal.jsp 로 들어가주면된다.

이런식으로 뜨면 성공이다.


[메인으로 돌아가기]

 

'Java Spring > JSP와 스프링' 카테고리의 다른 글

11. 액션 종합: 계산기 구현  (0) 2022.07.09
10. JSP 프로그래밍: 계산기 구현  (0) 2022.07.09
8. 계산기 구현  (0) 2022.07.08
7. Hello World!  (0) 2022.07.08
6. ToDo리스트 앱 만들기  (0) 2022.07.07
'Java Spring/JSP와 스프링' 카테고리의 다른 글
  • 11. 액션 종합: 계산기 구현
  • 10. JSP 프로그래밍: 계산기 구현
  • 8. 계산기 구현
  • 7. Hello World!
백고미
백고미
  • 백고미
    백고미의 정신세계
    백고미
  • 전체
    오늘
    어제
    • 분류 전체보기 (125)
      • [ 공지사항 ] (0)
      • 정보 (14)
        • 워프레임 (5)
        • 게임 (3)
        • 군대 (1)
        • 이민 (1)
      • Java Spring (43)
        • JSP와 스프링 (34)
        • Tip (9)
      • Spring boot (1)
        • Tip (1)
      • 직업 정보 (2)
        • 경찰 공무원 (2)
        • AAFES (0)
        • HD GFD (0)
      • 리뷰 (1)
        • 인터넷 (1)
      • Life (2)
        • 운동 (1)
        • 자격증 (1)
      • 소스모드 (27)
        • CSGO (7)
        • CSS (0)
        • HL2DM (2)
        • L4D2 (1)
        • BMS (0)
        • TIP (16)
        • Extension (1)
        • 문법 (0)
      • C# (4)
        • s&box (4)
      • LUA (8)
        • Garry's Mod (8)
      • Resource (11)
        • Player Model (1)
        • Npc Model (1)
        • Weapon Model (2)
        • PropPhyics (6)
        • PropDynamic (1)
        • Texture (0)
        • Animation Texture (0)
        • Overlay (0)
        • Effect Sound (0)
        • Particle (0)
      • 일기장 (1)
        • TRH (4)
        • 스케줄 (1)
        • Els (0)
        • 프로젝트 (3)
  • 블로그 메뉴

    • 홈
    • 태그
    • 미디어로그
    • 위치로그
    • 방명록
  • 링크

    • John John한 블로그
  • 공지사항

  • 인기 글

  • 태그

    경찰시험 응시 자격
    순경 가산점
    경기북부 병무청
    키벨류
    윈도우10 1주년
    경기북부 병무청 가는길
    경찰공무원 가산점표
    병무청 가는 법
    경기북부병무청 회룡역
    발표 PPT
    원동기장치면허
    경찰 공무원 응시 자격
    병무청 가는 길
    경기북부병무청
    병무청가는법
    윈도우10 참가자 프로그램
    경찰 가산점표
    공찰공무원 필수과목
    경기북부병무지청
    경기북부병무청 가는법
    경찰공무원 선택과목
    경찰 간부후보생
    경기북부병무청 망월사
    스쿼트 운동 효과
    윈도우10 닌자캣
    경기북부 병무청 가는 법
    경기북부 병무청 가는 길
    윈도우10 고양이
    운전면허 종류
    병무청가는길
  • 최근 댓글

  • 최근 글

  • hELLO· Designed By정상우.v4.10.3
백고미
9. JSP 기초 종합 예제
상단으로

티스토리툴바