转自 SiteMesh的使用

SiteMesh的介绍就不多说了,主要是用来统一页面风格,减少重复编码的。

它定义了一个过滤器,然后把页面都加上统一的头部和底部。

需要先在WEB-INF/lib下引入sitemesh的jar包:http://wiki.sitemesh.org/display/sitemesh/Download 。这里使用2.4版本。

过滤器定义:

在web.xml中

    <filter>
<filter-name>sitemesh</filter-name>
<filter-class>com.opensymphony.module.sitemesh.filter.PageFilter</filter-class>
</filter>
<filter-mapping>
<filter-name>sitemesh</filter-name>
<url-pattern>/*</url-pattern>
</filter-mapping>

decorators.xml文件:

WEB-INF下新建decorators.xml文件:

<?xml version="1.0" encoding="utf-8"?>
<decorators defaultdir="/WEB-INF/layouts/">
<!-- 此处用来定义不需要过滤的页面 -->
<excludes>
<pattern>/static/*</pattern>
</excludes> <!-- 用来定义装饰器要过滤的页面 -->
<decorator name="default" page="default.jsp">
<pattern>/*</pattern>
</decorator>
</decorators>

不用过滤/static/目录下的文件,然后指定了装饰器:/WEB-INF/layouts/default.jsp。

我用的是Spring MVC,目录结构大致:

default.jsp:

<%@ page contentType="text/html;charset=UTF-8"%>
<%@ taglib prefix="sitemesh" uri="http://www.opensymphony.com/sitemesh/decorator" %>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core"%> <c:set var="ctx" value="${pageContext.request.contextPath}" /> <!DOCTYPE html>
<html>
<head>
<title>QuickStart示例:<sitemesh:title/></title>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
<meta http-equiv="Cache-Control" content="no-store" />
<meta http-equiv="Pragma" content="no-cache" />
<meta http-equiv="Expires" content="0" /> <link type="image/x-icon" href="${ctx}/static/images/favicon.ico" rel="shortcut icon">
<link href="${ctx}/sc/bootstrap/2.3.0/css/bootstrap.min.css" type="text/css" rel="stylesheet" />
<link href="${ctx}/sc/jquery-validation/1.11.0/validate.css" type="text/css" rel="stylesheet" />
<link href="${ctx}/css/base/default.css" type="text/css" rel="stylesheet" />
<script src="${ctx}/sc/jquery/jquery-1.9.1.min.js" type="text/javascript"></script>
<script src="${ctx}/sc/jquery-validation/1.11.0/jquery.validate.min.js" type="text/javascript"></script>
<script src="${ctx}/sc/jquery-validation/1.11.0/messages_bs_zh.js" type="text/javascript"></script> <sitemesh:head/>
</head> <body>
<div class="container">
<%@ include file="/WEB-INF/layouts/header.jsp"%>
<div id="content">
<sitemesh:body/>
</div>
<%@ include file="/WEB-INF/layouts/footer.jsp"%>
</div>
<script src="${ctx}/sc/bootstrap/2.3.0/js/bootstrap.min.js" type="text/javascript"></script>
</body>
</html>

首先引入了SiteMesh标签。

<sitemesh:title/> 会自动替换为被过滤页面的title。

<sitemesh:head/> 会把被过滤页面head里面的东西(除了title)放在这个地方。

<sitemesh:body/> 被过滤的页面body里面的内容放在这里。

在content的上下引入了header和footer。

我们在头部引入了js和css,就可以重用了。

使用:


使用的过程中,几乎感受不到SiteMesh的存在。例如下面的页面:

<%@ page language="java" contentType="text/html; charset=utf-8"
pageEncoding="utf-8"%>
<!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>被装饰(目标)页面title</title>
<script type="text/javascript" src="/js/hello.js"></script>
</head> <body>
<h4>被装饰(目标)页面body标签内内容。</h4>
<h3>使用SiteMesh的好处?</h3>
<ul>
<li>被装饰(目标)页面和装饰页面完全分离。</li>
<li>做到真正的页面复用,一个装饰页面装饰多个被装饰(目标)页面。</li>
<li>更容易实现统一的网站风格。</li>
<li>还有。。。</li>
</ul>
</body>
</html>

这就是一个普通的页面,但是被SiteMesh装饰之后,就会自动去掉<html> <body> <head>等元素,然后把相应的东西放在模板对应位置上。

我们来看一下,被SiteMesh装饰过的页面源代码:

<!DOCTYPE html>
<html>
<head>
<title>QuickStart示例:被装饰(目标)页面title</title>
<meta http-equiv="Content-Type" content="text/html;charset=utf-8" />
<meta http-equiv="Cache-Control" content="no-store" />
<meta http-equiv="Pragma" content="no-cache" />
<meta http-equiv="Expires" content="0" /> <link type="image/x-icon" href="/SpringMVC/static/images/favicon.ico" rel="shortcut icon">
<link href="/SpringMVC/sc/bootstrap/2.3.0/css/bootstrap.min.css" type="text/css" rel="stylesheet" />
<link href="/SpringMVC/sc/jquery-validation/1.11.0/validate.css" type="text/css" rel="stylesheet" />
<link href="/SpringMVC/css/base/default.css" type="text/css" rel="stylesheet" />
<script src="/SpringMVC/sc/jquery/jquery-1.9.1.min.js" type="text/javascript"></script>
<script src="/SpringMVC/sc/jquery-validation/1.11.0/jquery.validate.min.js" type="text/javascript"></script>
<script src="/SpringMVC/sc/jquery-validation/1.11.0/messages_bs_zh.js" type="text/javascript"></script> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <script type="text/javascript" src="/js/hello.js"></script> </head> <body>
<div class="container"> <div id="header">
</div>
<div id="content"> <h4>被装饰(目标)页面body标签内内容。</h4>
<h3>使用SiteMesh的好处?</h3>
<ul>
<li>被装饰(目标)页面和装饰页面完全分离。</li>
<li>做到真正的页面复用,一个装饰页面装饰多个被装饰(目标)页面。</li>
<li>更容易实现统一的网站风格。</li>
<li>还有。。。</li>
</ul> </div> <div id="footer">
Copyright © 2005-2012 <a href="">spring.org.cn</a>
</div> </div>
<script src="/SpringMVC/sc/bootstrap/2.3.0/js/bootstrap.min.js" type="text/javascript"></script>
</body>
</html>

SiteMesh查看文档 使用sitemesh建立复合视图 - 2.装饰器

SiteMesh中有一个decorator标签,可以轻松解决页面布局的问题

之前解决页面重复布局的时候,使用的是<include>标签,但是需要在每个页面都用他引入其他JSP文件

而使用decorator标签只需要在配置文件decorators.xml进行相应的配置再加上一个装饰器(其实就是一个JSP页面)即可。

web.xml文件中加入过滤器定义

	<!-- 过滤器定义 -->
<filter>
<filter-name>sitemesh</filter-name>
<filter-class>com.opensymphony.sitemesh.webapp.SiteMeshFilter</filter-class>
</filter>
<filter-mapping>
<filter-name>sitemesh</filter-name>
<url-pattern>/*</url-pattern>
</filter-mapping>

加入的配置文件decorators.xml

<?xml version="1.0" encoding="UTF-8"?>

<decorators defaultdir="/WEB-INF/decorators">
<!-- 此处用来定义不需要过滤的页面 -->
<excludes>
<pattern>/exclude.jsp</pattern>
<pattern>/exclude/*</pattern>
</excludes>
<!-- 用来定义装饰器要过滤的页面 -->
<decorator name="main" page="main.jsp">
<pattern>/*</pattern>
</decorator> </decorators>

在WebContent/WEB-INF/目录下创建/decorators目录,在这个目录下写main.jsp文件

<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<%@ taglib uri="http://www.opensymphony.com/sitemesh/decorator" prefix="decorator" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<!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">
<link rel="stylesheet" type="text/css" href="<%=request.getContextPath()%>/css/main.css"/>
<title>欢迎使用用户管理系统<decorator:title default="欢迎使用用户管理系统"/></title>
<decorator:head/> <!-- 取出被装饰页面的head标签中的内容(除了head标签本身) -->
</head> <body>
<h1><decorator:title/></h1> <!-- 取出被装饰页面的title标签中的内容 -->
<c:if test="${not empty loginUser}">
<a href="<%=request.getContextPath() %>/user/add">用户添加</a>
<a href="<%=request.getContextPath() %>/user/users">用户列表</a>
<a href="<%=request.getContextPath() %>/logout">退出系统</a>
当前用户:${loginUser.nickname }
</c:if>
<hr/>
<decorator:body/> <!-- 取出被装饰页面的body标签中的内容 -->
<div align="center" style="width:100%;border-top:1px solid; float:left;margin-top:10px;">
CopyRight@2012-2015<br/>
用户管理系统
</div>
</body>
</html>

Spring MVC学习笔记——SiteMesh的使用(转)的更多相关文章

  1. Spring MVC 学习笔记一 HelloWorld

    Spring MVC 学习笔记一 HelloWorld Spring MVC 的使用可以按照以下步骤进行(使用Eclipse): 加入JAR包 在web.xml中配置DispatcherServlet ...

  2. Spring MVC 学习笔记12 —— SpringMVC+Hibernate开发(1)依赖包搭建

    Spring MVC 学习笔记12 -- SpringMVC+Hibernate开发(1)依赖包搭建 用Hibernate帮助建立SpringMVC与数据库之间的联系,通过配置DAO层,Service ...

  3. Spring MVC 学习笔记11 —— 后端返回json格式数据

    Spring MVC 学习笔记11 -- 后端返回json格式数据 我们常常听说json数据,首先,什么是json数据,总结起来,有以下几点: 1. JSON的全称是"JavaScript ...

  4. Spring MVC 学习笔记10 —— 实现简单的用户管理(4.3)用户登录显示全局异常信息

    </pre>Spring MVC 学习笔记10 -- 实现简单的用户管理(4.3)用户登录--显示全局异常信息<p></p><p></p>& ...

  5. Spring MVC 学习笔记9 —— 实现简单的用户管理(4)用户登录显示局部异常信息

    Spring MVC 学习笔记9 -- 实现简单的用户管理(4.2)用户登录--显示局部异常信息 第二部分:显示局部异常信息,而不是500错误页 1. 写一个方法,把UserException传进来. ...

  6. Spring MVC 学习笔记8 —— 实现简单的用户管理(4)用户登录

    Spring MVC 学习笔记8 -- 实现简单的用户管理(4)用户登录 增删改查,login 1. login.jsp,写在外面,及跟WEB-INF同一级目录,如:ls Webcontent; &g ...

  7. Spring MVC 学习笔记2 - 利用Spring Tool Suite创建一个web 项目

    Spring MVC 学习笔记2 - 利用Spring Tool Suite创建一个web 项目 Spring Tool Suite 是一个带有全套的Spring相关支持功能的Eclipse插件包. ...

  8. Spring MVC 学习笔记1 - First Helloworld by Eclipse【& - java web 开发Tips集锦】

    Spring MVC 学习笔记1 - First Helloworld by Eclipse reference:http://www.gontu.org 1. 下载 Spring freamwork ...

  9. Spring MVC 学习笔记(整理)

    SpringMVC学习 1.概述 Spring MVC是一种基于Java实现MVC设计模式的请求驱动类型的轻量级Web框架,即使用了MVC架构模式的思想,将web层进行解耦,基于请求-响应模型帮助我们 ...

随机推荐

  1. 如何理解javaScript对象?

    在我们生活中,常常会提到对象一词,如:你找到对象了吗?你的对象是谁呀?等等. 在我们家庭中,有男友的女青年都会说我有对象了,那么她的对象是XX(她的男友). 夫妻间呢?都会说我的爱人是谁谁谁,现在我们 ...

  2. Atitit.redis操作总结

    Atitit.redis操作总结 1.1. 获取redis所有kv1 1.2. dbsize:返回当前数据库中key的数目 1 1.3. 一起吧所有key列出来1 1.4. Java连接redis   ...

  3. css之定位

    定位有三种,分别是相对定位 position:relative; .绝对定位 position:absolute; .固定定位 position:fixed; 相对定位 相对定位,就是微调元素位置的, ...

  4. CSS3:RGBA的使用方法

    1.说明 此色彩模式与RGB相同,只是在RGB模式上新增了Alpha透明度. RGBA(R,G,B,A) 2.取值 R: 红色值,正整数值的取值范围为:0 - 255,百分数值的取值范围为:0.0% ...

  5. C# 中Switch case 返回不止用break

    Switch(temp) { case "A": //跳出循环 break; case "B": //返回值 return var; case "C& ...

  6. shell 1>&2 2>&1 &>filename重定向的含义和区别

    当初在shell中, 看到">&1"和">&2"始终不明白什么意思.经过在网上的搜索得以解惑.其实这是两种输出. 在 shell 程 ...

  7. GNU Readline 库及编程简介

    用过 Bash 命令行的一定知道,Bash 有几个特性: TAB 键可以用来命令补全 ↑ 或 ↓ 键可以用来快速输入历史命令 还有一些交互式行编辑快捷键: C-A / C-E 将光标移到行首/行尾 C ...

  8. 【JS/CSS3】实现带预览图幻灯片效果~

    一.前期准备 1.1 案例分析 适用场景:单例布局1.2 方法论 V视图 HTML+CSS+调试C js实现控制流程D数据 优化扩展 二.代码 结构 <div class="slide ...

  9. 用grunt搭建web前端开发环境

    1.前言 本文章旨在讲解grunt入门,以及讲解grunt最常用的几个插件的使用. 2.安装node.js Grunt和所有grunt插件都是基于nodejs来运行的,如果你的电脑上没有nodejs, ...

  10. Centos6下安装高版本Git

    yum remove git .tar.gz /usr/src/ cd /usr/src/ cd git-/ make configure whereis autoconf yum install a ...