EasyUI学习(一)
一.什么是 jQuery EasyUI
jQuery EasyUI 是一组基于 jQuery 的 UI 插件集合,而 jQuery EasyUI 的目标就是帮助
Web 开发者更轻松的打造出功能丰富并且美观的 UI 界面。开发者不需要编写复杂的
JavaScript,也不需要对 css 样式有深入的了解,开发者需要了解的只有一些简单的 html 标签。官方网站:http://www.jeasyui.com
主要应用于网站后台。
二、注意事项
EasyUI是基于Jquery的,而我们将要使用最新的 jQuery EasyUI 版本:1.3.5,它里面自带的 jQuery 版本是 2.0。也
就是说,不再支持 IE6,7,8 这三款浏览器了。
三.下载及运行 jQuery EasyUI
<!DOCTYPE html> <html> <head> <title>jQuery Easy UI</title> <meta charset="UTF-8" /> <script type="text/javascript" src="easyui/jquery.min.js"></script> <script type="text/javascript" src="easyui/jquery.easyui.min.js"></script> <script type="text/javascript" src="easyui/locale/easyui-lang-zh_CN.js" ></script> <link rel="stylesheet" type="text/css" href="easyui/themes/default/easyui.css" /> <link rel="stylesheet" type="text/css" href="easyui/themes/icon.css" /> </head> <body> <div class="easyui-dialog" style="width:400px;height:200px" data-options="title:'My Dialog',collapsible:true,iconCls:'icon-ok',onOpen:function(){}"> dialog content. </div> </body> </html>
运行效果:
PS:虽然我们用了 HTML5 的格式,但所有标签还是沿用 XHTML 的,并为真正涉及到
HTML5 的标签和 CSS。