J2EE后台UI系统框架搭建-EXTJs使用（4.1 GPL版本）-CSDN博客

http://www.jb51.net/article/22493.htm，

********************************************************************************

整理如原文地址：http://www.cnblogs.com/animal/archive/2012/03/27/2420002.html

1.从http://www.sencha.com/products/extjs

下载最新的EXTJS框架文件，最像的版本为EXT-4.0.7-GPL，此版本在IE7/IE8下面运行效率不高，在EXT-4.1中会解决。

最新的extjs只需要复制以下的目录：

1，根目录下：ext-all.js

2，中文包库文件：d:\我的文档\Downloads\ext-4.1.0-gpl\extjs-4.1.0\locale\ext-lang-zh_CN.js

3,copy其中的resource目录：d:\我的文档\Downloads\ext-4.1.0-gpl\extjs-4.1.0\resources\ext-all.css

*********************************************************************

目录介绍：

adapter：负责将里面提供第三方底层库（包括Ext自带的底层库）映射为Ext所支持的底层库。
build：压缩后的ext全部源码(里面分类存放)。
docs： API帮助文档。
exmaples：提供使用ExtJs技术做出的小实例。
resources：Ext UI资源文件目录，如CSS、图片文件都存放在这里面。
source：无压缩Ext全部的源码(里面分类存放) 遵从Lesser GNU （LGPL）开源的协议。
Ext-all.js：压缩后的Ext全部源码。
ext-all-debug.js：无压缩的Ext全部的源码(用于调试)。
ext-core.js：压缩后的Ext的核心组件，包括sources/core下的所有类。
ext-core-debug.js：无压缩Ext的核心组件，包括sources/core下的所有类。

***********************************************************************

1.从http://www.sencha.com/products/extjs

下载最新的EXTJS框架文件，最像的版本为EXT-4.0.7-GPL，此版本在IE7/IE8下面运行效率不高，在EXT-4.1中会解决。

2.解压缩文件，得到以下目录

docs目录中是说明文档

examples目录中是EXTJS的例子

locale目录中是本地化文件

resources目录中是样式文件

src目录中是EXTJS控件文件

3.使用EXTJS4

在页面头部，引用EXTJS样式文件，EXTJS文件，本地化文件

<head>

<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />

<title>学习EXTJS4</title>

<!--EXTJS样式文件-->

<link rel="stylesheet" type="text/css" href="ext-4.0.7-gpl/ext-4.0.7-gpl/resources/css/ext-all.css"/>

<!--EXTJS文件-->

<script type="text/javascript" src="ext-4.0.7-gpl/ext-4.0.7-gpl/ext-all.js"></script>

<!--EXTJS本地化文件，会将EXTJS中的提示信息等自动转换为简体中文-->

<script type="text/javascript" src="ext-4.0.7-gpl/ext-4.0.7-gpl/locale/ext-lang-zh_CN.js"></script>


</head>

注：EXTJS文件的区别：

ext-all.js：包含所有的EXTJS框架文件，已经混淆

ext-all-debug.js：包含所有的EXTJS框架文件，没有混淆

ext-all-dev.js：包含所有的EXTJS框架文件，没有混淆，且包含调试信息

ext.js：仅包含能让EXTJS运行的最小集合，已经混淆

ext-debug.js：仅包含能让EXTJS运行的最小集合，没有混淆

ext-dev.js：仅包含能让EXTJS运行的最小集合，没有混淆，且包含调试信息

bootstrap.js：自动加载ext-all.js或者ext-all-debug.js，在以下情况下会加载ext-all-debug.js

1.当前主机名是本地

2.当前主机是使用IPV4地址

3.Current protocol is a file(不好意思，我不知道怎么翻译，请会的朋友说一下)

4.其他情况下自动加载ext-all.js

4.具体实例：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml">

<head>

<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />

<title>学习EXTJS4</title>

<!--EXTJS样式文件-->

<link rel="stylesheet" type="text/css" href="ext-4.0.7-gpl/ext-4.0.7-gpl/resources/css/ext-all.css"/>

<!--EXTJS文件-->

<script type="text/javascript" src="ext-4.0.7-gpl/ext-4.0.7-gpl/ext-all.js"></script>

<!--EXTJS本地化文件，会将EXTJS中的提示信息等自动转换为简体中文-->

<script type="text/javascript" src="ext-4.0.7-gpl/ext-4.0.7-gpl/locale/ext-lang-zh_CN.js"></script>

<script type="text/javascript">

<!--在页面加载完成后调用JS代码-->

Ext.onReady(function(){

<!--弹出提示信息框-->

Ext.Msg.alert('提示信息','学习EXTJS')

});

</script>

</head>

<body>



</body>

</html>