easyUi的环境搭建以及简单应用
这是笔者的第一篇博客，希望能够帮到那些和我一样爱学习的人，写的不好还请大家见谅。
作为一个后端程序员，前端的布局以及样式的编写一直让我很头疼，最近学习了easyUI前端框架，发现前端也可以如此简单，自己也可以做出漂亮的页面了，话不多说，进入正题吧
首先是easyUI的环境搭建
1.第一步
先从官网http://www.jeasyui.com/download/index.php下载easyUI组件，点击Freeware Edition下面的Download下载即可，下载后进行解压，会有好多文件夹，把目录下的demo删点，这是官网为我们提供的一些例子，可供我们学习的，至于配置上是不需要的。
2.第二步：
打开eclipse或者myeclipse,新建一个web项目，这里笔者以eclipse为例进行配置。将删除demo后的文件夹复制粘贴到WebContent目录下
3.第三步，也是大家比较容易出错的一步了，新建一个jsp文件easyuisupport.jsp，在这个文件里面进行easyUI的引用，这样做是为了防止以后大家要用的时候频繁引用它，浪费了时间也使页面显得太杂乱了，所以统一写在一个页面上，便与查看，也方便其他jsp引用，其他jsp可以通过<jsp:includepage="commonpage/easyuisupport.jsp"/> 或者是<%@ include file="inlayingJsp.jsp" %>的方式引入这个jsp
easyuisupport.jsp中的配置如图
<link rel="stylesheet"type="text/css"href="jquery-easyui-v1.5.3/themes/default/easyui.css"></link>
<link rel="stylesheet"type="text/css"href="jquery-easyui-v1.5.3/themes/icon.css"></link>
<scripttype="text/javascript"src="jquery-easyui-v1.5.3/jquery.min.js"></script>
<scripttype="text/javascript"src="jquery-easyui-v1.5.3/jquery.easyui.min.js"></script>
配置上这四个引用easyUI的环境部署就完成了，剩下的就是他的一个简单使用了
4.第四步
easyUI的简单应用
新建测试jsp test.jsp
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Insert title here</title>
<jsp:include page="commonpage/easyuisupport.jsp"/>
</head>
<body>
<div id="p" class="easyui-panel" title="Basic Panel" style="width:500px;height:200px;padding:10px;">
我的hello word!
</div>
</body>
</html>
然后进行运行测试，看到下图所示界面，表示easyUI配置成功了，后续可以多看看官方包里面的demo，更容易理解如何去使用它。