最近一直在找一个完全开源的web客户端框架，看到了dwz，虽然不知道到底怎么样，但还是支持国产，先学习一下。这篇文章先说一下怎么在项目里使用dwz框架。

首先先下载dwz：https://code.csdn.net/dwzteam/dwz_jui

下载成功后，将压缩包解压，文件夹内如图：

接下来在你的web项目的webroot下新建文件夹dwz,然后将上图东西拷贝进去

接下来将dwz文件夹中的index.html文件复制到你写页面的文件夹中，如图：

然后打开该index文件，修改引用文件的路径，如：

<html>

  <head>

    <base href="<%=basePath%>">

    <title>登陆</title>

<link href="<%=path %>/dwz/themes/default/style.css" rel="stylesheet" type="text/css" media="screen"/>

<link href="<%=path %>/dwz/themes/css/core.css" rel="stylesheet" type="text/css" media="screen"/>

<link href="<%=path %>/dwz/themes/css/print.css" rel="stylesheet" type="text/css" media="print"/>

<link href="<%=path %>/dwz/uploadify/css/uploadify.css" rel="stylesheet" type="text/css" media="screen"/>

<!--[if IE]>

<link href="themes/css/ieHack.css" rel="stylesheet" type="text/css" media="screen"/>

<![endif]-->

<!--[if lte IE 9]>

<script src="js/speedup.js" type="text/javascript"></script>

<![endif]-->

<script src="<%=path %>/dwz/js/jquery-1.7.2.js" type="text/javascript"></script>

<script src="<%=path %>/dwz/js/jquery.cookie.js" type="text/javascript"></script>

<script src="<%=path %>/dwz/js/jquery.validate.js" type="text/javascript"></script>

<script src="<%=path %>/dwz/js/jquery.bgiframe.js" type="text/javascript"></script>

<script src="<%=path %>/dwz/xheditor/xheditor-1.2.1.min.js" type="text/javascript"></script>

<script src="<%=path %>/dwz/xheditor/xheditor_lang/zh-cn.js" type="text/javascript"></script>

<script src="<%=path %>/dwz/uploadify/scripts/jquery.uploadify.js" type="text/javascript"></script>

<!-- svg图表  supports Firefox 3.0+, Safari 3.0+, Chrome 5.0+, Opera 9.5+ and Internet Explorer 6.0+ -->

<script type="text/javascript" src="<%=path %>/dwz/chart/raphael.js"></script>

<script type="text/javascript" src="<%=path %>/dwz/chart/g.raphael.js"></script>

<script type="text/javascript" src="<%=path %>/dwz/chart/g.bar.js"></script>

<script type="text/javascript" src="<%=path %>/dwz/chart/g.line.js"></script>

<script type="text/javascript" src="<%=path %>/dwz/chart/g.pie.js"></script>

<script type="text/javascript" src="<%=path %>/dwz/chart/g.dot.js"></script>

<script src="<%=path %>/dwz/js/dwz.core.js" type="text/javascript"></script>

<script src="<%=path %>/dwz/js/dwz.util.date.js" type="text/javascript"></script>

<script src="<%=path %>/dwz/js/dwz.validate.method.js" type="text/javascript"></script>

<script src="<%=path %>/dwz/js/dwz.barDrag.js" type="text/javascript"></script>

<script src="<%=path %>/dwz/js/dwz.drag.js" type="text/javascript"></script>

<script src="<%=path %>/dwz/js/dwz.tree.js" type="text/javascript"></script>

<script src="<%=path %>/dwz/js/dwz.accordion.js" type="text/javascript"></script>

<script src="<%=path %>/dwz/js/dwz.ui.js" type="text/javascript"></script>

<script src="<%=path %>/dwz/js/dwz.theme.js" type="text/javascript"></script>

<script src="<%=path %>/dwz/js/dwz.switchEnv.js" type="text/javascript"></script>

<script src="<%=path %>/dwz/js/dwz.alertMsg.js" type="text/javascript"></script>

<script src="<%=path %>/dwz/js/dwz.contextmenu.js" type="text/javascript"></script>

<script src="<%=path %>/dwz/js/dwz.navTab.js" type="text/javascript"></script>

<script src="<%=path %>/dwz/js/dwz.tab.js" type="text/javascript"></script>

<script src="<%=path %>/dwz/js/dwz.resize.js" type="text/javascript"></script>

<script src="<%=path %>/dwz/js/dwz.dialog.js" type="text/javascript"></script>

<script src="<%=path %>/dwz/js/dwz.dialogDrag.js" type="text/javascript"></script>

<script src="<%=path %>/dwz/js/dwz.sortDrag.js" type="text/javascript"></script>

<script src="<%=path %>/dwz/js/dwz.cssTable.js" type="text/javascript"></script>

<script src="<%=path %>/dwz/js/dwz.stable.js" type="text/javascript"></script>

<script src="<%=path %>/dwz/js/dwz.taskBar.js" type="text/javascript"></script>

<script src="<%=path %>/dwz/js/dwz.ajax.js" type="text/javascript"></script>

<script src="<%=path %>/dwz/js/dwz.pagination.js" type="text/javascript"></script>

<script src="<%=path %>/dwz/js/dwz.database.js" type="text/javascript"></script>

<script src="<%=path %>/dwz/js/dwz.datepicker.js" type="text/javascript"></script>

<script src="<%=path %>/dwz/js/dwz.effects.js" type="text/javascript"></script>

<script src="<%=path %>/dwz/js/dwz.panel.js" type="text/javascript"></script>

<script src="<%=path %>/dwz/js/dwz.checkbox.js" type="text/javascript"></script>

<script src="<%=path %>/dwz/js/dwz.history.js" type="text/javascript"></script>

<script src="<%=path %>/dwz/js/dwz.combox.js" type="text/javascript"></script>

<script src="<%=path %>/dwz/js/dwz.print.js" type="text/javascript"></script>

<!-- 可以用dwz.min.js替换前面全部dwz.*.js (注意：替换是下面dwz.regional.zh.js还需要引入)

<script src="bin/dwz.min.js" type="text/javascript"></script>

-->

<script src="<%=path %>/dwz/js/dwz.regional.zh.js" type="text/javascript"></script>

<script type="text/javascript">

$(function(){

	DWZ.init("<%=path %>/dwz/dwz.frag.xml", {

		loginUrl:"login_dialog.html", loginTitle:"登录",	// 弹出登录对话框

//		loginUrl:"login.html",	// 跳到登录页面

		statusCode:{ok:200, error:300, timeout:301}, //【可选】

		pageInfo:{pageNum:"pageNum", numPerPage:"numPerPage", orderField:"orderField", orderDirection:"orderDirection"}, //【可选】

		keys: {statusCode:"statusCode", message:"message"}, //【可选】

		ui:{hideMode:'offsets'}, //【可选】hideMode:navTab组件切换的隐藏方式，支持的值有’display’，’offsets’负数偏移位置的值，默认值为’display’

		debug:false,	// 调试模式 【true|false】

		callback:function(){

			initEnv();

			$("#themeList").theme({themeBase:"themes"}); // themeBase 相对于index页面的主题base路径

		}

	});

});

</script>

  </head>

尤其要注意那个js代码中引用dwz.frag.xml的路径也要改，修改成功后，在tomcat中部署运行，页面显示如：

index.html页面一般是作为项目的第一个页面，当然也可以改名字，里边的js,css文件就是项目里会用到的，在其他的页面中不再需要再次引用，之后和服务器的交互只是数据交互, 其它的页面使用也只需要页面碎片，就是<body></body>中的部分。

版权声明：本文为博主原创文章，未经博主允许不得转载。

玩转DWZ (一)---项目中怎么使用dwz的更多相关文章

  1. 实战派 | Java项目中玩转Redis6.0客户端缓存！

    原创:微信公众号 码农参上,欢迎分享,转载请保留出处. 哈喽大家好啊,我是Hydra. 在前面的文章中,我们介绍了Redis6.0中的新特性客户端缓存client-side caching,通过tel ...

  2. 【新手总结】在.Net项目中使用Redis作为缓存服务

    最近由于项目需要,在系统缓存服务部分上了redis,终于有机会在实际开发中玩一下,之前都是自己随便看看写写,很零碎也没沉淀下来什么,这次算是一个系统学习和实践过程的总结. 和Redis有关的基础知识 ...

  3. UML用例图在实际项目中的应用

    对我而言,目前还不能很好地回答这个问题.从来没有在项目中使用过模型,这还是因为以前项目不靠建模也能完成,没有用户,哪来的需求分析呢?UML建模,决定你建的是鸡窝还是摩天大楼,但是我做过的项目甚至连鸡窝 ...

  4. 在项目中 background transiton 带来的"便利"与“坑”

    本文就两个例子跟大家分享一下background-image与background-size的渐变(transition)所带来的方便与“深坑” 首选,说说这东西好的地方,有时候在做PC项目的时候,可 ...

  5. 去除vue项目中的#及其ie9兼容性

    一.如何去除vue项目中访问地址的# vue2中在路由配置中添加mode(vue-cli创建的项目在src/router/index.js) export default new Router({ m ...

  6. vue项目中遇到的那些事。

    前言 有好几天没更新文章了.这段实际忙着做了一个vue的项目,从 19 天前开始,到今天刚好 20 天,独立完成. 做vue项目做这个项目一方面能为工作做一些准备,一方面也精进一下技术. 技术栈:vu ...

  7. 如何去除vue项目中的 # --- History模式

    来自:https://www.cnblogs.com/zhuzhenwei918/p/6892066.html 侵删 使用vue-cli搭建的环境,在配置好路由之后,可以看到下面的情况: 但是不难发现 ...

  8. ABP module-zero +AdminLTE+Bootstrap Table+jQuery权限管理系统第十五节--缓存小结与ABP框架项目中 Redis Cache的实现

    返回总目录:ABP+AdminLTE+Bootstrap Table权限管理系统一期 缓存 为什么要用缓存 为什么要用缓存呢,说缓存之前先说使用缓存的优点. 减少寄宿服务器的往返调用(round-tr ...

  9. JAVA 项目中使用 H2 数据库

    为什么要使用H2数据库 H2数据库是可以嵌入到JAVA项目中的,因为只需要导入一个jar包即可,所以非常的方便. 项目中导入H2 将H2的jar包放到classpath里即可,我是用的maven,ma ...

随机推荐

  1. OpenCV——照亮边缘

    具体的算法原理可以参考: PS滤镜,照亮边缘 // define head function #ifndef PS_ALGORITHM_H_INCLUDED #define PS_ALGORITHM_ ...

  2. linux设备驱动模块引用和依赖

    /modules/04 # lsmod test 787 0 - Live 0xbf010000 (PO) func 633 1 test, Live 0xbf00c000 (PO) test -&g ...

  3. JQuery（二）---- JQ的事件与动画详解

    JQuery的事件 /** * 1.事件绑定的快捷方式: */ $("button:eq(0)").dblclick(function(){ alert("hahaah& ...

  4. Hibernate的二级缓存策略

    Hibernate的二级缓存策略的一般过程如下: 1) 条件查询的时候,总是发出一条select * from table_name where …. (选择所有字段)这样的SQL语句查询数据库,一次 ...

  5. 解密for循环工作机制之迭代器，以及生成器、三元表达式与列表解析、解压序列

    本节内容 1.迭代器协议与for循环 2.三元表达式 3.解压序列 4.列表解析 5.生成器 迭代器协议与for循环 1.迭代器协议是指:对象必须提供一个next方法,执行该方法要么返回迭代中下一项, ...

  6. [C#网络应用编程]2、对线程的管理

    在System.Threading命名空间下,有一个Thread类,用于对线程进行管理,如创建线程.启动线程.终止线程.合并线程.让线程休眠等 Thread类 (假设Thread firTh = ne ...

  7. pg_restore数据库恢复指令

    pg_restore restores a PostgreSQL database from an archive created by pg_dump. Usage:  pg_restore [OP ...

  8. [ SSH框架 ] Struts2框架学习之一

    一.Struts2框架的概述 Struts2是一种基于MVC模式的轻量级Web框架,它自问世以来,就受到了广大Web开发者的关注,并广泛应用于各种企业系统的开发中.目前掌握 Struts2框架几乎成为 ...

  9. Coursera-AndrewNg(吴恩达)机器学习笔记——第三周

    一.逻辑回归问题(分类问题) 生活中存在着许多分类问题,如判断邮件是否为垃圾邮件:判断肿瘤是恶性还是良性等.机器学习中逻辑回归便是解决分类问题的一种方法.二分类:通常表示为yϵ{0,1},0:&quo ...

  10. Java的精确整数计算-Bigdecimal学习总结和工具类

    随笔:随着最近工作需要,回首需要涉及到一些精确的数据计算,就需要用到Bigdecimal,索性就趁着闲暇之余整理收集一下关于Bigdecimal的使用方法,由于时间的原因,整理的并不是特别详细,但相信 ...