Java Server Pages(JSP)——10. 使用标签文件的几个例子

写在前面

这一部分将通过几个例子来学习标签文件——tag file的实际使用方法。

第一个tag file

这个例子的主要目的是来展示如何创建.tag文件，创建一个tag标签，并通过.jsp文件来引用该标签。

1.创建tag文件
要在WEB-INF文件夹下，创建一个tags文件夹用来存放.tag文件，注意这里文件名要写成tags。创建一个firstTag.tag文件，代码如下：

<%@ tag import="java.util.Date" import="java.text.DateFormat"%>
<%
    DateFormat dateFormat = DateFormat.getDateInstance(DateFormat.LONG);
    Date now = new Date(System.currentTimeMillis());
    out.println(dateFormat.format(now));
%>

firstTag.tag文件中使用了tag指令，tag指令又有两个import属性，import属性可以引用其他的Java库。firstTag.tag文件的名与创建的tag标签名字一样。也就是说这里创建了一个firstTag标签，可以在其他JSP文件中使用firstTag标签。

2.创建JSP文件
下面创建一个使用之前通过firstTag.tag文件创建的firstTag标签。代码如下：

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<%@ taglib prefix="easy" tagdir="/WEB-INF/tags" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>FirstTagTest.jsp</title>
</head>
<body>
    Today is <easy:firstTag/>
</body>
</html>

3.效果展示

通过URL链接来访问firstTagTest.jsp文件，效果如下所示：
这里写图片描述

通过include指令引入静态与动态文件

这个例子主要是展示tag指令的include属性，在tag文件中引入一个静态文件，这里是HTML文件，或者一个动态文件，这里也是tag文件，但是这里就要将tag文件后缀改为tagf。

1。创建tag文件
创建includeDemoTag.tag文件，并在该文件中，使用两个include属性，包含了在tag文件中不同位置引入一个静态HTML文件与一个动态tagf文件。tag文件代码如下：

This tag file shows the use of the include directive.
The first include directive demonstrates how you can include a static resource called included.html.
<br/>
Here is the content of included.html:
<%@ include file="included.html" %>
<br/>
<br/>
The second include directive includes another dynamic resource:
included.tagf.
<br/>
<%@ include file="included.tagf" %>

2.创建HTML文件
在tag文件同一文件路径下创建一个HTML文件，代码如下：

<!DOCTYPE html>
<table>
    <tr>
        <td><b>Menu</b></td>
    </tr>
    <tr>
        <td>CDs</td>
    </tr>
    <tr>
        <td>DVDs</td>
    </tr>
    <tr>
        <td>Others</td>
    </tr>
</table>

3.创建tagf文件
这个文件也要与之前的tag文件与html文件在同一路径下，具体代码如下：

<%
    out.print("Hello from include.tagf");
%>

4.创建JSP文件
下面创建一个JSP文件，用来调用之前创建的tag文件，tag文件名相同的tag标签。代码如下：

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<%@ taglib tagdir="/WEB-INF/tags" prefix="easy" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<title>Insert title here</title>
</head>
<body>
    <easy:includeDemoTag/>
</body>
</html>

5.运行效果
同样是通过URL路径调用JSP文件。效果如下所示：
这里写图片描述

使用attribute指令

这个例子将会使用attribute指令构建一个tag，该tag可以对一个字符串进行HTML编码。这个tag将会定义一个input属性，将在JSP页面中对该属性赋值。

1.创建tag文件
下面创建一个encode.tag文件，该文件将产生一个同名的tag：encode，这个标签定义了一个input属性。代码如下：

<%@ attribute name="input" required="true" %>
<%!
    private String encodeHtmlTag(String tag) {
        if (tag==null) {
            return null;
        }
        int length = tag.length();
        StringBuilder encodedTag = new StringBuilder(2 * length);
        for (int i=0; i<length; i++) {
            char c = tag.charAt(i);
            if (c=='<') {
                encodedTag.append("&lt");
            } 
            else if (c=='>') {
                encodedTag.append("&gt");
            } 
            else if (c=='&') {
                encodedTag.append("&amp");
            } 
            else if (c=='"') {
                encodedTag.append("&qout");
            } 
            else if (c==' ') {
                encodedTag.append("&nbsp");
            } 
            else {
                encodedTag.append(c);
            }
        }
        return encodedTag.toString();
    }
%>

<%=encodeHtmlTag(input)%>

2.创建JSP文件
下面将创建一个JSP文件，引用encode标签，代码如下所示：

<%@ taglib prefix="easy" tagdir="/WEB-INF/tags" %>
<easy:encode input="<br/> means changing line"/>

3.效果展示
这里写图片描述

查看网页源代码会发现：
这里写图片描述

使用variable指令

这里将使用variable指令，在tag文件中定义多个变量，并传输到JSP页面中，

1.创建tag文件
varDemo.tag提供了输出服务器当前日期长格式与短格式两个功能，定义了两个变量：longDate和shortDate。代码如下：

<%@ tag import="java.util.Date" import="java.text.DateFormat"%>
<%@ variable name-given="longDate" %>
<%@ variable name-given="shortDate" %>
<%
    Date now = new Date(System.currentTimeMillis());
    DateFormat longFormat = DateFormat.getDateInstance(DateFormat.LONG);
    DateFormat shortFormat = DateFormat.getDateInstance(DateFormat.SHORT);
    jspContext.setAttribute("longDate", longFormat.format(now));
    jspContext.setAttribute("shortDate", shortFormat.format(now));
%>
<jsp:doBody/>

注意，这里使用了jspContext.setAttribute方法来设置变量。 jspContext是一个隐藏对象。 JSTL中的set标签也能实现同样的功能，如果对JSTL熟悉，可以使用set标签来代替setAttribute方法。

同时需要注意的是，这里使用了doBody动作元素来调用这个标签体。

2. 创建JSP文件
varDemoTest.jsp使用了varDemo.tag的标签。代码如下：

<%@ taglib prefix="tags" tagdir="/WEB-INF/tags" %>
Today's date:
<br/>
<tags:varDemo>
In long format: ${longDate}
<br/>
In short format: ${shortDate}
</tags:varDemo>

3.效果展示
这里写图片描述

使用doBody动作元素

下面的这个例子说明了如何用doBody来调用标签本体内容并将内容保存在一个叫作referer的变量中。

假设你有一个卖玩具的网站，并且在多个搜索引擎上做了这个玩具网站的广告。现在你想要知道每个搜索引擎为玩具网站带来的流量有多少转化成了购买行为。为了做到这点，你可以记录每个网站首页访问的referer头部信息，使用一个tag file来将referer头信息保存到session属性中。如果某个用户在后续购买了产品，就可以从session属性中获得referer头信息，并记录在数据库中。

这个例子包含了一个HTML文件（searchEngine.html）、两个JSP文件（main.jsp 和 viewReferer.jsp）以及一个tag file (doBodyDemo.tag)。

main.jsp页面是玩具网站的首页，使用了doBodyDemo标签来保存referer头信息。
viewReferer.jsp页面用来查看收集到的referer头信息。如果直接通过URL访问main.jsp，那么referer头信息即为null。因此你必须通过searchEngine.html来链接到main.jsp页面。
searchEngine.html页面代表一般搜索引擎页面，这里起个示意作用。

1.构建tag文件
doBodyDemo.tag文件内容如下所示：

<jsp:doBody var="referer" scope="session"/>

doBodyDemo.tag只有一行：一个doBody动作元素。它指定了一个叫作referer的session属性来保存标签本体内容。

2.构建JSP文件
main.jsp文件内容如下所示：

<%@ taglib prefix="tags" tagdir="/WEB-INF/tags" %>
Your referer header: ${header.referer}
<br/>
<tags:doBodyDemo>
    ${header.referer}
</tags:doBodyDemo>
<a href="viewReferer.jsp">View</a> the referer as a Session attribute.

main.jsp页面通过文本和EL表达式输出referer头信息，页面使用了doBody Demo标签，标签body也输出了referer头信息。紧接着，输出一个指向ViewReferer页面的链接。

viewReferer.jsp文件内容如下所示。

The referer header of the previous page is ${sessionScope.referer}

viewReferer.jsp页面通过EL表达式将referer中保存的值打印了出来。

searchEngine.html文件内容如下所示。

Please click <a href="main.jsp">here</a>

3.效果展示

可以通过URL访问HTML页面，效果如下：
这里写图片描述

现在点击这个链接跳转到main.jsp页面， main.jsp中获取的referer头信息将包含searchEngine.html的URL地址。

这里写图片描述

main.jsp页面调用了doBodyDemo元素标签，将内容存储在名为referer的session属性中。接下来，点击main.jsp中的View链接，就可以在viewReferer.jsp页面中看到这个内容了。

这里写图片描述

使用invoke指令

invokeDemo.tag中使用了attribute指令，并且将fragment属性值设为true。另外还定义了三个变量。最后调用了productDetails的fragment。由于在invoke动作元素中， var和varReader都没有设置，因此fragment的内容将直接传递到JSP页面的JspWriter中。

1.构建tag文件

<%@ attribute name="productDetails" fragment="true" %>
<%@ variable name-given="productName" %>
<%@ variable name-given="description" %>
<%@ variable name-given="price" %>
<%
    jspContext.setAttribute("productName", "Pelesonic DVD Player");
    jspContext.setAttribute("description",
        "Dolby Digital output through coaxial digital-audio jack," 
        +" 500 lines horizontal resolution-image digest viewing");
    jspContext.setAttribute("price", "65");
%>
<jsp:invoke fragment="productDetails"/>

2.构建JSP文件

<%@ page language="java" contentType="text/html; charset=ISO-8859-1"
    pageEncoding="ISO-8859-1"%>
<%@ taglib prefix="easy" tagdir="/WEB-INF/tags" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
    <head>
        <title>Product Details</title>
    </head>
    <body>
        <easy:invokeDemo>
        <jsp:attribute name="productDetails">
        <table width="220" border="1">
            <tr>
                <td><b>Product Name</b></td>
                <td>${productName}</td>
            </tr>
            <tr>
                <td><b>Description</b></td>
                <td>${description}</td>
            </tr>
            <tr>
                <td><b>Price</b></td>
                <td>${price}</td>
            </tr>
        </table>
        </jsp:attribute>
        </easy:invokeDemo>
    </body>
</html>

3.效果展示
这里写图片描述