自定义tag标签的好处
程序员可以自定义一些特定功能的标签, 用来达到封装代码, 分工, 重用性等多种好处.
如何存放tag标签
通常在web工程WEB-INF文件夹下创建tags文件夹来存放自定义的tag,如/WEB-INF/tags
tag标签的语法
要知道怎样定义tag标签就需要知道tag标签的基本属性,例如:
<%@ tag body-content="empty" trimDirectiveWhitespaces="true" pageEncoding="UTF-8"%>
通常我们在.tag文件的开头加上以上的代码来告诉jsp容器这是一个tag标记文件。
body-content有以下三种属性:
- empty:这个是一个空标记.
- scriptless:标记主体可以有内容, 并且jsp容器会去处理里面的jsp元素, 这些内容可以是文本, EL表达式, 标准动作甚至另一个自定义标记.
- tagdependent:标记主体可以有内容, 而jsp容器会把它们当作纯文件处理
trimDirectiveWhitespaces=“true”表示删除多余的空行
pageEncoding=”UTF-8” 表示page的编码格式
标记中也可以定义attribute,例如:
<%@ attribute name="x" required="true" rtexprvalue="true" %>
<%@ attribute name="y" required="true" rtexprvalue="true" %>
attribute的属性介绍如下:
- name :这个attribute的名称.
- required : true/false, 是否必须的.
- rtexprvalue : true/false, 这个attribute可否使用EL表达式, 否则为纯文本.
- type : 设定这个attribute的类型, jsp容器会把结果自动转换成这个类.
我们看一下index.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 tagdir="/WEB-INF/tags/" prefix="yu" %>
<!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=UTF-8">
<title>define tag</title>
</head>
<body>
<!-- test tag [body-content="empty"] -->
<yu:add x="1" y="2"/>
</body>
</html>
该index.jsp中引用了add.tag文件,看一下add.tag文件的定义:
<%@ tag body-content="empty" trimDirectiveWhitespaces="true" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ attribute name="x" required="true" rtexprvalue="true" %>
<%@ attribute name="y" required="true" rtexprvalue="true" %>
<div>
<h4>The result of x+y is</h4>
result = ${x+y}
</div>
运行起来程序我们看看运行结果:
至此,基本上已经理解了tag文件的使用了吧,那我们做进一步的学习。继续编写index.jsp代码,来验证body-content=”scriptless”的tag文件:
1 <!-- test tag [body-content="scriptless"] -->
2 <yu:scriptless_tag>
3 This tag's body-content is [scriptless], let's have a test, i'm here.<br/>
4 <label>contextPath:<label/> ${pageContext.request.contextPath}
5 </yu:scriptless_tag>
那我们来看一下scriptless_tag.tag文件的定义:
1 <%@ tag body-content="scriptless" trimDirectiveWhitespaces="true" pageEncoding="UTF-8"%>
2 <div style="background-color: red; width=auto">my backgroud color is red</div>
3 <jsp:doBody></jsp:doBody>
4 <div style="background-color: blue; width=70px;">my backgroud color is blue</div>
细心的朋友发现这里面多了一个<\jsp:doBody>标签,该标签的作用就是讲index.jsp中该标记文件标记的主体显示在该处,来看一下程序运行结果吧,一目了然:
在index.jsp文件中scriptless_tag标签标记的主体显示在了红色背景和蓝色背景之间,并且将代码${pageContext.request.contextPath}解析成了 /yuTestTag
继续编写index.jsp代码,来验证body-content=”tagindependent”的tag文件:
1 <!-- test tag [body-content="tagindependent"] -->
2 <yu:tagdependent_tag>
3 This tag's body-content is [tagindependent], let's have a test, i'm here.
4 <label>contextPath:<label/> ${pageContext.request.contextPath}
5 </yu:tagdependent_tag>
scriptless_tag.tag文件的定义和scriptless_tag.tag的内容基本一样:
1 <%@ tag body-content="tagdependent" trimDirectiveWhitespaces="true" language="java" pageEncoding="UTF-8"%>
2 <div style="background-color: red; width=auto">my backgroud color is red</div>
3 <jsp:doBody></jsp:doBody>
4 <div style="background-color: blue; width=70px;">my backgroud color is blue</div>
继续看看运行结果:
代码${pageContext.request.contextPath}没有被解析,只是当做纯文本文件
最后附上index.jsp的完整代码:
1 <%@ page language="java" contentType="text/html; charset=UTF-8"
2 pageEncoding="UTF-8"%>
3 <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
4 <%@ taglib tagdir="/WEB-INF/tags/" prefix="yu" %>
5 <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
6 <html>
7 <head>
8 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
9 <title>define tag</title>
10 </head>
11 <body>
12 <!-- test tag [body-content="empty"] -->
13 <yu:add x="1" y="2"/>
14
15 <hr>
16
17 <!-- test tag [body-content="scriptless"] -->
18 <yu:scriptless_tag>
19 This tag's body-content is [scriptless], let's have a test, i'm here.<br/>
20 <label>contextPath:<label/> ${pageContext.request.contextPath}
21 </yu:scriptless_tag>
22
23 <hr>
24
25 <!-- test tag [body-content="tagindependent"] -->
26 <yu:tagdependent_tag>
27 This tag's body-content is [tagindependent], let's have a test, i'm here.
28 <label>contextPath:<label/> ${pageContext.request.contextPath}
29 </yu:tagdependent_tag>
30 </body>
31 </html>
网友评论