jsp jstl el tag 视图层技术总结
? ? ?最近做些前台页面表现层的工作，对这些东西好久没有接触了。遇到一些问题，总结一下：
?
? ? * 自定义标签文件：
? ? ? ? ? ?在用自定义标签实现功能时候总是报错，如下：
javax.servlet.jsp.JspException: javax.el.PropertyNotFoundException: Property 'header' not found on type java.lang.String
具体代码如下：
?
<%@tag pageEncoding="UTF-8" body-content="empty" import="com.express.platform.model.system.*"%> <%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%><%@taglib prefix="fn" uri="http://java.sun.com/jsp/jstl/functions" %><%@taglib prefix="fmt" uri="http://java.sun.com/jsp/jstl/fmt" %><%@ attribute name="module" required="true" rtexprvalue="true" %> <div var="tab"> <c:if test="${not empty tab.tab && not empty tab.tab.text}"> <c:set value="true" var="isShow" scope="page"></c:set> </c:if> <c:remove var="tab"/> </c:forEach> <c:if test="${not empty isShow && isShow == "true"}"> <div var="tab"> <div>${tab.tab.text }</div> </c:forEach> </div> <c:remove var="tab"/> </c:if> <div var="tab"> <div var="colWidth"><td width="${colWidth }"></td></c:forEach></tr> <c:forEach items="${tab.tableData }" var="rowData"> <tr> <c:forEach items="${rowData }" var="colData" varStatus="index"> <c:choose> <c:when test="${colData.type.type == "url" || colData.fold }"> <td }"> <img src="${colData.url }" /> </c:when> <c:when test="${colData.type.type == "url" }"> <a href="${colData.url }" title="${colData.text }">${colData.text }</a> </c:when> <c:otherwise> ${colData.text } </c:otherwise> </c:choose> </td> </c:forEach> </tr> </c:forEach> </table> </div> </c:forEach> </div> <div var="footer" > <c:choose> <c:when test="${footer.type.type == "img" }"> <img src="${footer.url }" /> </c:when> <c:when test="${footer.type.type == "url" }"> <a href="${footer.url }" title="${footer.text }">${footer.text }</a> </c:when> <c:otherwise> ${footer.text } </c:otherwise> </c:choose> </c:forEach> </div> </div> ?从异常信息看，貌似是module中没有header属性，仔细看了下代码，没有错，module对象中的确有header这个属性，再在页面中通过${module}打印数据，发现数据能够完整展示，怪了。怎么会这么样了。在仔细看看你异常：?
javax.servlet.jsp.JspException: javax.el.PropertyNotFoundException: Property 'header' not found on type java.lang.String
貌似是说在String中没有找到header属性，但我的el代码是${module.header},莫非el将module当成了String来处理，但打印时候又正常，能取到对应的内容，通过jsp script <% ?%>方式一切都正常， 在尝试在tag里面通过? ?${module.class.name }打印传入module的类型，结果显示java.lang.String ，my god，原来如此，接着就是想想办法在el里面将module 转换成自己真正的类型，查了下资料在<%@attribute 指令 中有一个type属性，可以指定传入到tag里面参数的类型，将module的type类型指定后，结果一切正常。自定义标签在处理数据的时候，假如我们不在attribute指定参数的类型，那么参数会以String的形式传递进来，只有手动指定传入的类型，才能在tag里面正常使用。最红attribute代码如下：
?
<%@ attribute name="module" required="true" rtexprvalue="true" type="com.express.platform.model.system.UserModule" %>
?
通过自定义标签、struts 标签 ，attribute 等指令 定义的变量数据，如<c:set var="xx".... 、 attribute 的name="xxx" 可以再<% %>里面直接引用，编译后的文件如下：
?
public void setJspContext(JspContext ctx) { private com.express.platform.model.system.UserModule module; public com.express.platform.model.system.UserModule getModule() { return this.module; } public void setModule(com.express.platform.model.system.UserModule module) { this.module = module; jspContext.setAttribute("module", module); } 。。。。。。?通过编译后的文件可以看出，module也就是在struts 、attribute指令 、jstl 中定义的变量,该变量在页面里面一个全局变量，所以在<% ?%>可以直接引用，在set注入时，会放到jspContext中，所以可以再page里面找到该变量。
?
?
?
*el表达式是使用
? ?el表达式只能去对象的属性，并且是提供了get方法的属性，不能调用对象的方法，要判断对象是否为null ，字符串是否长度为0， 集合是否为空集合，在el里面可以使用empty ，如上脚本: ${empty data} ?、 ${not empty data}都是用于为空性判断。
?
*jstl 保准标签库
core 包括： set ?、remove ?、out 、 if ?、 choose 、 when 、otherwise ?、 forEach 、 forTokens、 redirect
?
c:redirect <c:redirect url="/main.jsp" context="/mvc" />
c:forTakens 对字符串进行截断运算
<c:forTakens items="zhang:san:li:hao" var="info" delims=":">
<c:out value="${info}" />
</c:forTakens>
?
sql 包括： ?datasource ?、 query 、 delete ?、update 其中update可以调用存储过程
?
format 标签包括： fmt:formatNumber value="" pattern=".000" fmt:formatDate value="" type="date time both"
?
?
?
* 特殊CSS
clear:left / right / both; 由于div float 以后脱离了原来的页面流，导致原来的内容围绕在float元素周围，为了清除这种围绕可以使用clear属性，有时为了让float在视觉上围绕父容器，也可以再float元素下添加一个clear元素的div让父容器包含float元素
?
overflow:scroll / hidden /?visible; 当内容溢出的时候，该如何显示,scroll 是折行滚动， visiable 是直接显示不剪切，hidden是溢出的内容自动切除，不显示，此属性一般用在div上，用在table上不管用。
?
text-overflow：clip / ellipsis?
?
table-layout：fixed，用于控制表格布局，如下：
?
固定表格布局与自动表格布局相比，允许浏览器更快地对表格进行布局。
在固定表格布局中，水平布局仅取决于表格宽度、列宽度、表格边框宽度、单元格间距，而与单元格的内容无关。
通过使用固定表格布局，用户代理在接收到第一行后就可以显示表格。
在自动表格布局中，列的宽度是由列单元格中没有折行的最宽的内容设定的。
此算法有时会较慢，这是由于它需要在确定最终的布局之前访问表格中所有的内容
?
?
要让表格里面的内容在溢出的时候显示为...，需要定义表格 的tablelayout：fixed，定义td的overflow：hidden; text-overflow:ellipsis;
? -o-text-overflow: ellipsis 和 text-overflow 的作用一样，只是为了兼容oper显示...而设置的。
?
控制表格数据内容溢出时候需要下面样式结合：
table{
table-layout:fixed;
}
?
?
td{
white-space: nowrap;
overflow: hidden;
? ? ? ? -o-text-overflow: ellipsis; ? ?
? ? ? ? text-overflow: ? ?ellipsis; ?
}
?
?
表格数据内容溢出时就会显示为....
?
word-wrap:normal / break-word;
控制容器里面字符到到容器边界是否自动换行；
normal控制连续文本换行。 显示效果会换行，但到边界的时候如果是一个英文单词，这个英文单词不会换行，即词内换行不会发生。
div p a{ ....}div > .nav_menu{.......}?
相邻兄弟选择器
? ?相邻兄弟元素选择器是派生选择器的一种特殊类型，其限制是派生选择器应用的是所有子孙元素，而相邻兄弟选择器仅仅对某一元素后面的兄弟元素有效
div + .nav_menu{.......}?
选择器分组：
? ?一类元素拥有同样的css属性。
div,a,p,.menu{.....}?并列元素处理
?
属性选择器
通过元素的属性过滤元素，这个用的比较少.
?
input[type="text"]{ width:150px; display:block; margin-bottom:10px; background-color:yellow; font-family: Verdana, Arial;}input[type="button"]{ width:120px; margin-left:35px; display:block; font-family: Verdana, Arial;}?通过[]表明元素的属性，来过滤元素应用css属性。
?
[title='contnet']{......}?
?
下面例子表示带menuclass属性的div，设置字体为红色。
?
div.menu{color:red;}?
?
?
下面例子标准id为menu的div，设置字体为红色
div#menu{color:red;}?上面两种写法是对属性选择器的变形方式。理解就好了。?
?
?
?
?
?