영보의 SystemOut.log

[JSP] JSTL / JSTL 라이브러리 / JSTL 예제 본문

국비교육(아이티센 입사교육)/JSP

[JSP] JSTL / JSTL 라이브러리 / JSTL 예제

영보로그 2021. 10. 19. 11:34
반응형
자바/스프링 기반 디지털 융합 웹 개발자 양성과정

 

 

JSTL

- JSTL(JSP Standard Tag Library)은 커스텀 태그 라이브러리 기술을 이용 해 일반적으로 필요한 기능들을 표준화한 것으로 크게 코어(CORE), XML, I18N(국제화), 데이터베이스(SQL), 함수(Function) 라이브러리로 나눠진다

- jsp 파일에 JSTL을 적용하여면 jstl.jar와 standard.jar 파일을 해당 프로젝트의 ‘WEB-INF\lib’ 폴더로 복사한다

 

 

 

JSTL 라이브러리별 uri 및 prefix

라이브러리 uri prefix
코어 http://java.sun.com/jsp/jstl/core c
XML http://java.sun.com/jsp/jstl/xml x
I18N http://java.sun.com/jsp/jstl/fmt fmt
데이터베이스 http://java.sun.com/jsp/jstl/sql sql
함수 http://java.sun.com/jsp/jstl/funtions fn

- JSTL은 표현언어에서 사용할 수 있는 함수를 제공한다

- fn:replace(string, before, after)

 ► string 내에 있는 before 문자열을 after 문자열로 모두 변경해서 반환하는 함수이다

 (예) ${fn:replace(list.gb_contents, CRLF, ””)}

 

          

 

JSTML 라이브러리

# 코어

라이브러리 기능 태그 접두어
코어 General Purpose Actions (일반적인 것) catch
out
remove
set
c
Conditional Actions (조건) if
choose
when
otherwise
Iterator Actions (반복) forEach
forTokens
URL Related Actions (URL 관련 있는) import
redirect
url
param

[참고] 코어 라이브러리는 표현식, 반복처리, URL 관리 기능 등을 제공하므로 웹 애플리케이션을 개발할 때 유용하게 사용할 수 있다

 

 

# I18N(국제화)

라이브러리 기능 태그 접두어
I18N(국제화) Locale setLocale fmt 
Number and DateFormatting formatNumber formatDate

 

 



 

 

자주 쓰이는 태그들

 

# <c:if> 태그

해당 조건에 맞으면 태그의 body 내용을 처리한다.  자바의 if문과 유사하지만, else는 지원하지 않는다.

문법

test 속성 – 검사할 조건

var 속성 – test 조건의 결과를 저장할 변수(결과는 true 혹은 false)

 

 

# <c:choose>, <c:when>, <c:otherwise> 태그

이들 태그는 함께 사용되며 자바의 switch문과 유사한 기능을 한다  태그 내에는 태그 여러 개가 올 수 있다

문법

 

 

# <c:forEach> 태그

반복문과 관련된 태그로 forEach태그는 자바 for문과 유사하다. 가장 유용한 JSTL태그중 하나이다.

문법

 

 

 

예제

 

window_scrollToEx.jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!-- 추가 -->
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>[중요] 윈도우 스크롤의 절대 위치로 이동하기</title>
<style>
	#scroll-to-top {
		width:50px;
		height:50px;
		position:fixed;
		bottom:3rem;
		right:3rem;
	}
</style>
</head>
<body>
	<h3>오픈마켓</h3>
	<h2>과일 상품 목록 리스트</h2>
	<div id="apple">
		<div>
			<img src="./images/appleImage.jpg"/>
		</div>
		<div>
			<b><c:out value="청송 꿀사과" /></b>
		</div>
		<div>
			<b><fmt:formatNumber value="12000" pattern="#,###원" /></b>
		</div>
		<div>
			<small><c:out value="고당도 아삭한 사과의 감칠맛" /></small>
		</div>
	</div>
	
	<div id="grape">
		<div>
			<img src="./images/grapeImage.jpg"/>
		</div>
		<div>
			<b><c:out value="홍성 샤인 머스켓 포도" /></b>
		</div>
		<div>
			<b><fmt:formatNumber value="20000" pattern="#,###원" /></b>
		</div>
		<div>
			<small><c:out value="껍질째 먹는 씨 없는 포도" /></small>
		</div>
	</div>
	
	<div id="strawberry">
		<div>
			<img src="./images/strawberryImage.jpg"/>
		</div>
		<div>
			<b><c:out value="강진 딸기" /></b>
		</div>
		<div>
			<b><fmt:formatNumber value="15000" pattern="#,###원" /></b>
		</div>
		<div>
			<small><c:out value="달콤한 딸기 해외에서도 유명해요" /></small>
		</div>
	</div>
	
	<div id="watermelon">
		<div>
			<img src="./images/watermelon.jpg"/>
		</div>
		<div>
			<b><c:out value="함안 수박" /></b>
		</div>
		<div>
			<b><fmt:formatNumber value="25000" pattern="#,###원" /></b>
		</div>
		<div>
			<small><c:out value="달달하고 시원한 유명 수박" /></small>
		</div>
	</div>
	<br><br>
	<input id="scroll-to-top" type="image" src="./images/top_image.png"
			onclick="javascript:window.scrollTo(0,0)" alt="맨위로 스크롤 이동"/>
</body>
</html>

 

 

반응형