ExtJS 4.2快速入门-优快云博客

本文链接：https://blog.youkuaiyun.com/coco2d_x2014/article/details/52986835

1、下载 extjs4.2
官网：http://www.sencha.com/products/extjs
百度网盘：http://pan.baidu.com/s/1dDrPXTn
2、解压 extjs4.2 解压后目录结构如下图：
extjs4.2解压后目录结构图

其中：
builds：ExtJS 压缩后的代码，经过压缩的代码体积更小，加载更快。
docs： ExtJS 的文档，其中最重要的是ExtJS的API。
examples：官方的演示示例，通过对这些演示示例的熟悉，就能很快掌握 ExtJS 开发。
locale：多国语言的资源文件，其中 ext-lang-zh_CN.js 是简体中文。
pkgs：ExtJS 各部分功能的打包文件。
resources：ExtJS 要用到的图片文件和样式表文件。
src：目录是未压缩的源代码目录。
bootstrap.js：ExtJS 库的引导文件，通过参数可以自动切换 ext_all.js 和 ext_all_debug.js。
ext_all.js：ExtJS 的核心库，是必须要引入的。
ext_all_debug.js：ext_all.js 的调试版。

3、然后创建两个文件夹，如下图：

其中 ExtJS文件夹是放 ExtJS4.2框架的，HelloExtJS文件夹是项目开发文件。
ExtJS文件夹展开如下：
ExtJS文件夹内如
里面 plugins 和 resources 文件夹是把ExtJS4.2的拷贝过来。至于locale 文件夹只有一个文件（可选） ext-lang-zh_CN.js

4、在 HelloExtJS文件夹中建一个 html 文件。

helloextjs.html内容如下：

<html>
  <head>
    <meta http-equiv="content-Type" content="text/html; charset=utf-8">
    <title>Ext JS 4.2 Examples</title>
    <link rel="stylesheet" type="text/css" href="../ExtJS/resources/css/ext-all.css" />
    <script type="text/javascript" src="../ExtJS/bootstrap.js"></script>
    <script type="text/javascript" src="../ExtJS/locale/ext-lang-zh_CN.js"></script>

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