如果是一个临时项目，属于做完收工，不考虑后续扩展改进升级等问题的话，那么直接弄一份DWZ的拷贝放到项目下修修改改没有什么问题；但如果是一个产品，或者是一个基础的开发框架，那么更友好的整合DWZ应当是要考虑的问题。
我的应用场景是将DWZ整合到开发框架中，本身这个开发框架是需要持续改进的，所以我希望DWZ有新的版本时我可以更快的引入新的版本到开发框架中。
我不希望修改DWZ本身发布包中的任何文件，这样我就可以在下一次升级时直接将这些文件替换成新的，而不用考虑我曾修改过其中的某一块代码会被新版本的文件覆盖掉。
DWZ发布的文件可以放置在一个独立的目录下，结构像这样：
再创建一个用于修正DWZ的目录，结构像这样：
fix.js中可以写入对DWZ的一些修正或扩展方法，例如覆盖DWZ的一些js方法。而thems目录下的结构与DWZ是一致的，这里可以修正DWZ的core.css或皮肤下的style.css以及图片等。
除了DWZ本身所带的组件以外，或许我们还需要有自己的一些组件或自定义样式，那么依然可以按照上面的目录结构再创建一个扩展目录，像这样：
一旦使用了DWZ并且你希望应用系统能够无缝的使用DWZ提供的换肤功能，那么按照DWZ的换肤机制来设定你的扩展是最简便合理的一种方式，所以目录结构应当是保持一致的。
DWZ的换肤机制是采用js动态的修改首页中引用的样式来实现的，它给每种皮肤定义了一个名称并设定了该名称的目录名，换肤时将default下的style.css更换为其他几个目录下的style.css，于是整个应用的皮肤就会被新的样式渲染。在dwz.theme.js中我们可以看到源代码。
由于上面我们扩展了两个相同结构的目录，所以DWZ换肤的代码应当做相应的修改，在触发theme方法时，我们同时替换三个目录下的style.css文件，当然你如果乐意，也可以是四个、五个。这一段代码我是写在fix.js中的：
/** 覆盖DWZ的theme函数，支持多个部分的样式替换。*/
$.fn.extend({
theme : function(options) {
var op = $.extend({
dwzTheme : "coo/ui/dwz/themes",
fixTheme : "coo/ui/fix/themes",
xuiTheme : "coo/ui/xui/themes",
appTheme : "themes"
}, options);
var dwzThemeHref = op.dwzTheme + "/#theme#/style.css";
var fixThemeHref = op.fixTheme + "/#theme#/style.css";
var xuiThemeHref = op.xuiTheme + "/#theme#/style.css";
var appThemeHref = op.appTheme + "/#theme#/style.css";
return this.each(function() {
var jThemeLi = $(this).find(">li[theme]");
var setTheme = function(themeName) {
var dwzThemeLink = $("head").find("link[href^='" + op.dwzTheme + "'][href$='style.css']");
var fixThemeLink = $("head").find("link[href^='" + op.fixTheme + "'][href$='style.css']");
var xuiThemeLink = $("head").find("link[href^='" + op.xuiTheme + "'][href$='style.css']");
var appThemeLink = $("head").find("link[href^='" + op.appTheme + "'][href$='style.css']");
if(dwzThemeLink.size() > 0) {
dwzThemeLink.attr("href", dwzThemeHref.replace("#theme#", themeName));
}
if(fixThemeLink.size() > 0) {
fixThemeLink.attr("href", fixThemeHref.replace("#theme#", themeName));
}
if(xuiThemeLink.size() > 0) {
xuiThemeLink.attr("href", xuiThemeHref.replace("#theme#", themeName));
}
if(appThemeLink.size() > 0) {
appThemeLink.attr("href", appThemeHref.replace("#theme#", themeName));
}
jThemeLi.find(">div").removeClass("selected");
jThemeLi.filter("[theme=" + themeName + "]").find(">div").addClass("selected");
if($.isFunction($.cookie))
$.cookie("dwz_theme", themeName);
}
jThemeLi.each(function(index) {
var $this = $(this);
var themeName = $this.attr("theme");
$this.addClass(themeName).click(function() {
setTheme(themeName);
});
});
if($.isFunction($.cookie)) {
var themeName = $.cookie("dwz_theme");
if(themeName) {
setTheme(themeName);
}
}
});
}
});
其中appTheme是指当前应用的主题目录位置。dwzTheme/fixTheme/xuiTheme已封装到基础开发框架中供所有应用共用，而appTheme只应用于当前应用系统，适用于针对当前应用系统定制样式，例如应用logo、首页头部样式等。
最后需要注意的一点是在首页的head中引入css和js时应当注意顺序，依次是dwz->fix->xui->app，因为这里应用了页面引入css和js时的覆盖特性，顺序是很重要的。