`
- 浏览:
8166 次
- 性别:
- 来自:
深圳
-
优雅的解决web布局的问题 -- sitemesh的使用
webwork的开发团队opensymphony提供了一种优雅的解决页面布局的方法sitemesh。
sitemesh应用Decorator模式，用filter截取request和response,把页面组件head,content,banner
结合为一个完整的视图。通常我们都是用include标签在每个jsp页面中来不断的包含各种header,
stylesheet, scripts and footer，现在，在sitemesh的帮助下，我们可以开心的删掉他们了
下边是创建一个简单实例的步骤：
1，新建一个标准的web工程叫sitemesh
在WebRoot下新建一个index.jsp,内容如下
1 <% @ page contentType = " text/html; charset=utf-8 " %>
2 this is index.jsp.
3 it ' s a simple page
接着在webRoot下新建几个目录
style2
login
shared
在login下建立目录style3
然後把index.jsp分别复制到style2，login/style3,shared下
现在访问下边的链接:
http://localhost:8080/sitemesh/index.jsp
http://localhost:8080/sitemesh/style2/index.jsp
http://localhost:8080/sitemesh/login/style3/index.jsp
http://localhost:8080/sitemesh/shared/index.jsp
得到的结果是一样的，那我们如何让这四个相同的index.jsp有不同的样式呢。除了每个里边加入include
还有个解决办法，就是sitemesh
2,在opensymphony.sourceforge.net下载sitemesh.jar ,sitemesh-decorator.tld,sitemesh-page.tld
三个文件。
复制sitemesh.jar到WEB-INF/lib下，
复制sitemesh-decorator.tld,sitemesh-page.tld到WEB-INF下
把下边这部分加入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>
<taglib>
<taglib-uri>sitemesh-decorator</taglib-uri>
<taglib-location>/WEB-INF/sitemesh-decorator.tld</taglib-location>
</taglib>
<taglib>
<taglib-uri>sitemesh-page</taglib-uri>
<taglib-location>/WEB-INF/sitemesh-page.tld</taglib-location>
</taglib>
--------------------------------------------------------------------------------
在WEB-INF下建立一个decorators.xml，内容如下
excludes代表不使用的部分
其它三个是匹配url，使用style
--------------------------------------------------------------------------
<decorators defaultdir="/decorators">
<excludes>
<pattern>/shared/*</pattern>
</excludes>
<decorator name="style1" page="style1.jsp">
<pattern>/*</pattern>
</decorator>
<decorator name="style2" page="style2.jsp">
<pattern>/style2/*</pattern>
</decorator>
<decorator name="style3" page="style3.jsp">
<pattern>/*/style3/*</pattern>
</decorator>
</decorators>
--------------------------------------------------------------------------
在WebRoot下新建一个目录decorators
然後在下边建立三个jsp文件,内容如下
------------------------------------------------------------------
<%@ page contentType="text/html; charset=utf-8"%>
<%@ taglib uri="sitemesh-decorator" prefix="decorator" %>
<html>
<head>
<title><decorator:title default="装饰器页面..." /></title>
<decorator:head />
</head>
<body>
<p><font color="red">this is style2's header</font></p>
<hr>
<decorator:body />
<hr>
<p><font color="red">this is style1's footer</font></p>
</body>
</html>
------------------------------------------------------------------
<%@ page contentType="text/html; charset=utf-8"%>
<%@ taglib uri="sitemesh-decorator" prefix="decorator" %>
<html>
<head>
<title><decorator:title default="装饰器页面..." /></title>
<decorator:head />
</head>
<body>
<p><font color="green">this is style2's header</font></p>
<hr>
<decorator:body />
<hr>
<p><font color="green">this is style2's footer</font></p>
</body>
</html>
------------------------------------------------------------------
<%@ page contentType="text/html; charset=utf-8"%>
<%@ taglib uri="sitemesh-decorator" prefix="decorator" %>
<html>
<head>
<title><decorator:title default="装饰器页面..." /></title>
<decorator:head />
</head>
<body>
<p><font color="blue">this is style3's header</font></p>
<hr>
<decorator:body />
<hr>
<p><font color="blue">this is style3's footer</font></p>
</body>
</html>
------------------------------------------------------------------
再次访问
http://localhost:8080/sitemesh/index.jsp
http://localhost:8080/sitemesh/style2/index.jsp
http://localhost:8080/sitemesh/login/style3/index.jsp
http://localhost:8080/sitemesh/shared/index.jsp
看到变化了吧。这只是个简单的展示，仔细思考一下你的需求，你能作出更好的布局方式。
sitemesh真不错。重要是学习简单20分种就搞定了
分享到：
相关推荐
- 在`sitemesh-demo01`项目中，可以看到一个简单的例子，包括装饰器模板、被装饰的页面和Web应用的配置。通过运行这个示例，你可以直观地了解Sitemesh如何工作。 7. **扩展与优化** - Sitemesh支持自定义装饰策略...
**正文** `sitemesh` 是一个开源的网页布局和装饰框架，主要用来帮助开发者实现网站的页面统一布局，提升网站...这将有助于你在实际项目中更加熟练地运用 sitemesh，为你的 Web 应用提供统一的页面布局和优雅的设计。
5. **与Web框架的集成**：sitemesh可以方便地与常见的Java Web框架（如Spring MVC、Struts等）集成，提供统一的页面装饰解决方案。 6. **自定义装饰逻辑**：开发者可以通过实现自定义的Decorator类，添加特定的装饰...
SiteMesh、SpringMVC 和 Mybatis 是三个在Java Web开发中广泛应用的技术框架，它们共同构建了一个高效、可...同时，由于这三个框架都有活跃的社区支持，遇到问题时也更容易找到解决方案，进一步降低了项目的维护成本。
1. **引入依赖**：首先，在项目中添加Sitemesh和Struts2-Sitemesh-plugin的库。如果是Maven项目，可以在pom.xml中添加对应的依赖；如果是非Maven项目，需要将jar包添加到项目的类路径中。 2. **配置web.xml**：在...
SiteMesh 是一个开源的 Web 应用程序框架，主要用于页面布局和装饰，它可以帮助开发者统一网站的外观和感觉，提供了一种优雅的方式来管理和装饰（或模板化）Web 应用程序的页面。在这个"SiteMesh入门示例"中，我们将...
解压缩`sitemesh-2.2.1.rar`后，你将找到包含库文件、文档和其他资源的目录结构，按照官方文档的指引进行配置和部署即可开始使用。 总的来说，Sitemesh 2.2.1是一个强大的工具，可以帮助开发者提高Web应用程序的...
SiteMesh 是一个开源的网页布局和装饰框架，主要用于Java Web应用程序，它可以帮助开发者实现页面的统一外观和感觉，以及提供了一种优雅的方式来管理和装饰应用程序的各个页面。在本篇文章中，我们将深入探讨...
在"struts2sitemesh-freemarker"源码中，我们可以深入理解它们是如何协同工作的： 1. **Struts2框架**：Struts2的核心是Action，它负责处理用户的请求。源码中包含了Action的实现，这些Action会处理HTTP请求，并...
Sitemesh则是一个网页布局和装饰框架，用于统一网站的外观和感觉，提供了一种优雅的方式来管理和装饰页面。将Struts2.0与Sitemesh结合，可以实现更高效的Web应用开发，提升用户体验。 Struts2.0 的核心特性包括： 1...
3. **ORM问题与解决方案**：针对ORM常见的性能瓶颈，如N+1查询问题，Grails提供了缓存策略和批量加载机制。 七、Grails的持续发展与更新 1. **Grails升级**：定期跟踪Grails框架的更新，利用官方文档或社区资源，...