zoukankan      html  css  js  c++  java
  • ExtJS使用总结和参考

    ExtJS作为一个Javascript框架有广泛的应用,本文在实际学习和应用的基础上提供一个快速的上手和学习的参考。

    ExtJS介绍

    要开始 Extjs,必须先从网上下载所有需要的文件。下载的文件解压后,包含若干个文件夹和文件,作用分别如下:

    adapter 文件夹:该文件夹包含了 extjs和其实框架如 jquery、yui、prototype的桥接器,用于Extjs和这些框架的友好整合。

    build文件夹:包含了所有 js文件的紧凑压缩版,方便网络传输,提高下载速度。

    docs 文件夹:Extjs 的帮助文档,遗憾的是要先布署在服务器上才能访问。网上有人制作了无需布署的版本。

    examples文件夹:自带的示例全部在该文件夹中,一定记得去看看。

    resources文件夹:包含了Extjs所需要的样式表文件和图片资源。

    source文件夹:源代码文件夹,没有经过压缩的版本。

    ext-base.js:基础类库。

    ext-core.js:核心类库。

    ext-all.js:类库完整版。

    ext-all-debug.js:带格式的未压缩的类库完整版,带调试功能。

    ext-core-debug.js:带格式的未压缩的核心类库。

    CHANGES.html:开发及升级日志。

    license.txt:协议,比较复杂,但用惯了盗版的我们来说完全不予理会。

    ExtJS使用

    [注意由于授权的问题http://extjs.org.cn/node/85 ]

    引入必要的js css

    在页面[一般是母板页]上引入js和css文件,这样Extjs风格的框架和界面就可自由使用了

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

    <script type="text/javascript" src="../extjs/ext-base.js"></script>

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

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

    要注意的是, 不要随意调整各文件的顺序, 特别是 ext-base.js必须在 ext-all.js文件之前,记住了!

    编码

    在页面上一般增加一个入口函数[一般这些代码放到独立的js文件中]:

    Ext.onReady(function(){

    });

    这里可以实现DOM元素的事件挂接和风格设置等,此时就可以使用ExtJS本身的库和编写类、函数交互了。

    实现ExtJS风格的自己的类:

    Ext.namespace("com.aptech");

    com.aptech.First = function(){

    //私有成员

    var kiss = "中华人民共和国";

    //私有方法

    //公有方法

    return {

    //公有成员

    init: function(){

    alert("init");

    alert(kiss);

    },

    //公有成员

    method: function(){

    alert("method");

    }

    };

    };

    Var fst = new com.aptech.First();

    ExtJS参考资源

    http://extjs.org.cn

    http://extjs.com/

    Extjs本身带的docs和example是重要的参考资料,使用前把这个过一遍,基本可以实现需要的界面和逻辑,基本不需要在网络上再四处找其他的参考了。

    对于Extjs没有包含的一些界面等,可以在这个站点找到很多基于ExtJS的扩展代码下载,重要按照说明引入这些资源即可。

    http://extasp.net 是在asp.net的应用

    北大青鸟李赞红 轻松搞定Extjs [学完这个对这个框架就更清楚了]

    http://wenku.baidu.com/view/d4676f0bf78a6529647d5399.html

    实例

    http://jsfkit.codeplex.com

  • 相关阅读:
    【ArchSummit干货分享】个推大数据金融风控算法实践
    Markdown 使用锚点
    部署ghost博客
    部署git server
    ubuntu 修改ssh远程主机名称,mac开机运行命令,静默方式启动virtual box虚拟机,静默执行run脚本
    meteor 实现 微信分享
    Android or iOS 运行 meteor App 屏幕一片空白 White screen的解决方法
    Ubuntu 修改用户密码与启动root账号
    meteor icons & splash配置
    meteor 安装 android sdk慢的改进方法
  • 原文地址:https://www.cnblogs.com/2018/p/1846798.html
Copyright © 2011-2022 走看看