Extjs 4学习2

主要学习采自:http://www.ishowshao.com/blog/2012/06/19/extjs-4-getting-started/

用的sdk为extjs4.2.1

根据其中的提示装了一个apache,我的安装目录为:C:\Apache2.2,然后在目录C:\Apache2.2\htdocs下随便建立了一个web工程demotest,其实建这个东西主要是想利用eclipse的智能提示什么的,图的就是方便。

这样建好后的工程截图如下:image

然后在工程根目录下建立两个文件:app.js,index.html,

两个文件如下所示:

index.html

<html>
<head>
    <title>Hello Ext</title>
    <link rel="stylesheet" type="text/css" href="/extjs4.2.1/resources/css/ext-all.css">
    <script type="text/javascript" src="/extjs4.2.1/ext-all.js"></script>
    <script type="text/javascript" src="/demotest/app.js"></script>
</head>
<body></body>
</html>

app.js

Ext.application({
    name: 'HelloExt',
    launch: function() {
        Ext.create('Ext.container.Viewport', {
            layout: 'fit',
            items: [
                {
                    title: 'Hello Ext',
                    html : 'Hello! Welcome to Ext JS.'
                }
            ]
        });
    }
});

然后在chrome浏览器上输入:http://localhost/demotest/index.html,显示如下:

image

你可能感兴趣的:(ExtJs)