読者です 読者をやめる 読者になる 読者になる

Code Log

プログラミングの勉強メモを残していきます。

JSPでWEB-INF以下のcssファイルやJavaScriptを取り込む


<スポンサーリンク>

以下のようなディレクトリ構成のJava Webアプリケーションを見てみます。

f:id:sho322:20150107003448j:plain

JSPでCSSを取り込むためには、JSPのタグ?を使います。

WEB-INF以下のファイルを取り込むためには、

<%@include file="../js/test2.js" %>

というincludeディレクティブを使います。

includeディレクティブは、このディレクティブを記述した位置に他のHTMLファイルやJSPファイルなどのテキストファイルを読み込みます。

たとえば、

<%@include file="../js/test2.js" %>

とすると、上のディレクトリ一覧で言うと、
WEB-INF/js/test2.js
を取り込みます。

jspファイルから見た相対パスを指定しています。

で、「取り込む」ということは、すなわち、ブラウザから見ると、そのJSPファイルにそのままベタ書きされて見えるわけです。
JavaScriptファイルのリンクが貼られるわけではありません。

CSSも、

<%@include file="../css/main.css" %>

で取り込むことができます。

他に色々と試してみました。

コンテキストルート直下にあるcssやjsファイルを読み込む方法です。

以下のように書くと、コンテキストルート直下/css/main.cssを読み込みます。

<link rel="stylesheet" href="${pageContext.request.contextPath}/css/main.css">

次のように書いても大丈夫です。

<script type="text/javascript" src='<c:url value="/js/test.js"/>'></script>

これでコンテキストルート直下のjs/test.jsを読み込むことができます。

WEB-INF直下のファイルをブラウザからリンクで参照する方法はわかりませんでした。
そもそも見えないものなはずなので、リンクにすることは難しいのかもしれません。