JSF Web资源 JSFWeb资源|JSF

本文概述

JSF Web资源示例：访问图像文件
JSF Web资源示例：访问CSS文件
JSF Web资源示例：访问JavaScript文件

JSF Web资源是在Web应用程序中正确呈现所需的资源。它包括图像, 脚本文件和任何用户创建的组件库。
JSF提供了一种存储Web资源的标准方法。你可以使用以下任何一种来存储资源。

它必须存储在Web应用程序根目录下资源目录的子目录中：resources / resource-identifier。
Web应用程序的类路径中打包的资源必须位于Web应用程序内META-INF / resources目录的子目录中：META-INF / resources / resource-identifier。你可以使用此文件结构将资源打包到Web应用程序中捆绑的JAR文件中。

JavaServer Faces运行时将按上述顺序在前面列出的位置中查找资源。
JSF Web资源示例：访问图像文件 JSF提供< h：graphicImage /> 标记来访问Web应用程序中的Image。在下面的示例中, 首先我们创建了一个资源和一个名为images的子文件夹。创建文件夹后, 我们的应用程序结构如下所示。

文章图片
现在, 你可以像下面这样编写代码。 < h：graphicImage> 标记指定名为hello.gif的图像在目录网页/资源/图像中。
// index.xhtml

< h:body> < h:form id="user-form" enctype="multipart/form-data"> < h:graphicImage value="http://www.srcmini.com/#{resource['images:hello.gif']}"/> < h:graphicImage library="images" name="hello.gif"/> < /h:form> < /h:body>

在这段代码中, 我们通过两种方式访问??图像。一种是使用表达语言中的资源数组。其次, 通过指定库属性。
输出：
两个图像标签均产生相同的输出。

文章图片
JSF Web资源示例：访问CSS文件 < h：outputStylesheet> 标记用于访问Web应用程序中的CSS资源。你必须在资源文件夹内创建一个子目录, 如下所示。

文章图片
在以下示例中, 我们正在访问网页中的test.css文件。
// index.xhtml

< html xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://xmlns.jcp.org/jsf/html"> < h:head> < title> Web Resources Example< /title> < h:outputStylesheet library="css" name="test.css"/> < /h:head> < h:body> < h1> Welcome to The srcmini!< /h1> < /h:body> < /html>

// test.css

h1 { color: red; text-align: center; }

输出：

文章图片
JSF Web资源示例：访问JavaScript文件 < h：outputScript> 标记用于访问Web应用程序中的JavaScript文件。以下屏幕快照显示了JavaScript文件在项目中的位置。

文章图片
在这里, 我们正在借助标签访问JavaScript文件。
// index.xhtml

< html xmlns="http://www.w3.org/1999/xhtml" xmlns:h="http://xmlns.jcp.org/jsf/html"> < h:head> < title> Web Resources Example< /title> < h:outputScriptlibrary="js" name="test.js"/> < /h:head> < h:body> < /h:body> < /html>

// test.js