include 활용 *

  include Directive

일부 소스코드를 포함시키는 개념이다.

 

 

이러한 웹페이지 레이아웃에서, 다음 페이지를 가도 본문내용만 변하고 top,left,hadan의 내용은 변함이 없게하고 싶다.

앞서 공부한 jsp 파일연동을 이용하여 레이아웃을 쪼개어 각각의 파일로 저장후 불러오게 하겠다.

 

 

webcontent에 새로운 폴더 module을 만든다.

그리고 상단, 왼쪽, 하단을 구성할 세개의 jsp파일 top, left, hadan을 만든다.

 

▶ 문법

<%@ include file="/module/top.jsp" %>
<%@ include file="/module/left.jsp" %>
<%@ include file="/module/hadan.jsp" %>

 

 

▶ 적용

먼저 index.jsp 파일의 헤더 부분(상단메뉴)을 잘라낸다.(ctrl+x)

 

 

잘라낸 부분 대신 <%@include%> 구문을 넣었다.

include 구문에서 지시하는 주소(/module/top.jsp)의 파일을 연결시켜준다.

 

 

새로 만든 module/top.jsp 파일에 index.jsp파일의 잘라냈던 부분을 붙여넣는다.(ctrl+v)

이 파일이 index.jsp 파일과 연결되어 페이지에서 정상적으로 작동할것이다.

 

 

 

index.html 을 실행시키면, 전과같이 어색한 부분없이 상단메뉴가 한 페이지에 자연스럽게 보인다.

이런식으로 왼쪽메뉴와 하단 메뉴, 다음페이지도 마찬가지로 include 코드를 사용하여 보다 효율적인 웹페이지의 레이아웃을 구성할 수 있다.