ExtJS 4.2 系列教程（1）：Hello ExtJS4

1、下载ExtJS

http://www.sencha.com/

我下载的版本是 ext-4.2.1.883

2、使用Eclipse创建Dynamic Web Project ，不懂的自行google（今天下午彻底挂了）or 百度

3、引入ExtJS库

• 复制ext目录下的resources文件夹到WebRoot的static路径下，里面包含ext提供的主题和css文件

• 复制bootstrap.js、ext-all.js、ext-all-debug.js三个文件
  

• 复制locale中ext-lang-zh_CN.js中文语言包（可选）

4、新建index.jsp文件

在head引入上述Extjs库

<link rel="stylesheet" type="text/css" href="static/ext/resources/css/ext-all.css"/>
<script type="text/javascript" src="static/ext/bootstrap.js"></script>
<script type="text/javascript" src="static/ext/locale/ext-lang-zh_CN.js"></script>

5、修改bootstrap.js文件

找到

  document.write('<script type="text/javascript" charset="UTF-8" src="' + 
        path + 'ext-all' + (isDevelopment ? '-dev' : '') + '.js"></script>');

修改为：

  document.write('<script type="text/javascript" charset="UTF-8" src="' + 
        path + 'ext-all' + (isDevelopment ? '-debug' : '') + '.js"></script>');

6、在index.jsp的body中编写测试用例

<script type="text/javascript">
	Ext.onReady(function(){
		Ext.MessageBox.alert("hello","Hello,ExtJS4");
	});
</script>

7、部署到Tomcat服务器，运行 http://localhost:8123/ext/index.jsp