오늘이라도
[Web] 7. JSP 본문
- JSP -
○ JSP(Java Server Page) : WebContent → New → JSP File
- HTML 코드에 자바 코드를 삽입해서 만든 페이지
- 서버 측에서 동작되는 언어(Server Side Language)
- 확장자는 *.jsp
- 동작 방식 : 컴파일 과정 거쳐야 하므로 최초 실행은 느리다.
① test.jsp가 서블릿으로 변경 : test_jsp.java(서블릿)
② test_jsp.java가 컴파일 : test_jsp.class(클래스)
③ test_jsp.class가 실행\workspace\.metadata\.plugins\org.eclipse.wst.server.core\tmp0\work\Catalina\localhost\fp\org\apache\jsp
★ JSP 구성 요소
1. 스크립트적인 요소(프로그래밍적인 요소)
① 스크립틀릿 : 가장 많이 사용되는 요소
- <% 자바 코드 %>
② 지시자 : MIME ② 지시자 : MIME Type, import, JSTL
- <%@ page contentType = "text/html; charset=UTF-8" %>
- <%@ page import = "com.hanul.study.MemberDTO" %>
- <%@ taglib prefix = "c" url = "http://java.sun.com/jsp/jst1/core" %>
③ 선언문 : 메서드 정의 → 별도의 클래스에 구현
- <%! public void 메서드명(매개 변수) { ~~ 코드 구현~~ } %>
④ 표현식 : 값을 출력
- <%= 변수명 %>
- <%= 수식 %>
- <%= 메서드 호출문 %>
2. UI 요소(화면 구현 요소)
⑥ html
⑦ css
⑧ javascript, jQuery
▼jsp01.jsp : 변수 선언, 메서드 작성, 메서드 실행
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%
int num1 = 1;
int num2 = 100;
int sum = getSum(num1, num2);
%>
<%!
public int getSum(int num1, int num2) {
int sum = 0;
for(int i = num1; i <= num2; i++) {
sum += i;
}
return sum;
}
%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>JSP01</title>
</head>
<body>
<%-- jSP 주석 --%>
<!-- HTML 주석 -->
두 수 사이의 누적합 : <%= sum %>
</body>
</html>
▼jsp02.jsp : 객체 생성, 메서드 호출, scope 설정, 메서드 실행
<%@page import="com.hanul.study.SumMachine"%>
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%
SumMachine sm = new SumMachine();
int sum = sm.getSum(1, 100);
pageContext.setAttribute("sum", sum); //바인딩(연결) 객체 : Scope 설정
%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>JSP02</title>
</head>
<body>
두 수 사이의 누적합 : ${sum } <%-- EL 표기법(문법) --%>
</body>
</html>
▼gugudan01.jsp : jsp로 구구단 작성
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Gugudan JSP</title>
</head>
<body>
[구구단 출력]<br />
<table border="1">
<tr bgcolor="silver">
<%for(int i = 2; i <= 9; i++) { %>
<th style="color: red;"><%=i %>단</th>
<%} %>
</tr>
<%for(int i = 1; i <= 9; i++) { %>
<tr>
<%for(int j = 2; j <= 9; j++) { %>
<%if (i % 2 == 1) { %>
<%if (j * i >= 10) { %>
<td bgcolor="yellow"><%=j %> X <%=i %> = <%=i * j%></td>
<%} else { %>
<td bgcolor="yellow"><%=j %> X <%=i %> = 0<%=i * j%></td>
<%} %>
<%} else if (i % 2 == 0) { %>
<%if (j * i >= 10) { %>
<td bgcolor="pink"><%=j %> X <%=i %> = <%=i * j%></td>
<%} else { %>
<td bgcolor="pink"><%=j %> X <%=i %> = 0<%=i * j%></td>
<%} %>
<%} %>
<%} %>
</tr>
<%} %>
</table>
</body>
</html>
'취업성공패키지 SW 개발자 교육 > Web' 카테고리의 다른 글
[Web] 9. JSP ③ : jsp06.jsp ~ jsp08jsp : 삭제 기능 추가, 회원 정보 수정 화면 구성 (0) | 2020.05.19 |
---|---|
[Web] 8. JSP ② : jsp03.jsp ~ jsp05.jsp (0) | 2020.05.18 |
[Web] 6. NCS 평가 프로젝트 : 작성 조건, 도서 정보 입력, 조회, 삭제 구현 (0) | 2020.05.13 |
[Web] 5. 회원 목록 삭제 추가, 정적 페이지 전환, 동적 페이지 전환 : forward(), sendRedirect() (0) | 2020.05.12 |
[Web] 4. SQL 테이블과 연동하여 HTML, Servlet, DTO, DAO 만들기 (1) | 2020.05.11 |