Ext.js入门

一:ExtJs简介:

     ExtJs通常简称为Ext,它是一个非常优秀的Ajax框架,用Javascript编写,它与后台技术无关,可以用来开发具有炫丽外观的富客户端应用。Ext所开发的多彩界面吸引了许多程序员的眼球,同时也吸引了众多客户,它似乎一夜之间就速讯流行开来,对于企业应用系统,成MIS类型的系统而言,Ext非常适合。

二:Extjs的技术特点:

   1: Ext提供了大量高级的用户界面元素,这是RIA所必需的
   2: 良好的兼容性,能在多种平台下兼容主流浏览器
   3: Ext这个框架是完全面向对象且可扩展的
   4: 良好的用户体验、响应速度快,运行核心快速高效
   5: Ext易用,简洁,文档齐全,示例丰富
   6: 服务端方面,Ext可以与任何其他常用服务器端Web开发语言一起使用,包括:php、java、.net、ruby、coldfusion等

三、ExtJs的未来
ExtJs前景广阔,原因有三:
   1、ExtJS最大的优势在于它将Web应用程序的操作方式向传统桌面应用程序的操作方式进行转化甚至消除了这种差异,从根本上提高了用户的使用体验
   2、使用ExtJS对浏览器没有任何要求可以说是一种绿色的富客户端实现方式,这是它应用前景广阔的第二个原因
   3、ExtJS提供的各种组件可以用更加标准的方式展示数据降低了开发难度

四:ExtJs的缺点
  1、文件大,加载速度并不理想
  2、而且在低版本的浏览器上显示效果不佳。
  3、低版本有内存泄漏的问题
  4、尚无很好的开发调试环境与开发环境
  5、学习成本相对其他客户端语言偏高
  6、商业应用需收费

五:下载地址:https://www.sencha.com/products/extjs/#overview

六:文件解压后的内容:

七:每个文件的含义:

  1.adapter:负责将里面提供第三方底层库(包括Ext自带的底层库)映射为Ext所支持的底层库。   

  2.build:  压缩后的ext全部源码(里面分类存放)。    

  3. docs:  API帮助文档。  

  4. exmaples:提供使用ExtJs技术做出的小实例。   

  5.resources:Ext UI资源文件目录,如CSS、图片文件都存放在这里面。  

  6. source: 无压缩Ext全部的源码(里面分类存放) 遵从Lesser GNU (LGPL) 开源的协议。   

  7 .Ext-all.js:压缩后的Ext全部源码。  

  8. ext-all-debug.js:无压缩的Ext全部的源码(用于调试)。 

  9. ext-core.js:压缩后的Ext的核心组件,包括sources/core下的所有类。 

 10. ext-core-debug.js:无压缩Ext的核心组件,包括sources/core下的所有类。

 八:使用:

    应用extjs需要在页面中引入extjs的样式及extjs库文件,样式文件为resources/css/ext-all.css,

   extjs的js库文件主要包含两个,adapter/ext/ext-base.js及ext-all.js,其中ext-base.js表示框架基础库,ext-all.js是extjs的核心库。

   adapter表示适配器,也就是说可以有多种适配器,

   因此,可以把adapter/ext/ext-base.js换成adapter/jquery/ext-jquery-adapter.js,或adapter/prototype/ext-prototype-adapter.js等。

 因此,要使用ExtJS框架的页面中一般包括下面几句:
     <link rel="stylesheet" type="text/css" href="extjs/resources/css/ext-all.css" /> 

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

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

<script type="text/javascript">
     Ext.onReady(function(){
alert("孙丽媛");
});
</script>

 

九:Ext开发工具
1、JsEclipse
http://www.interaktonline.com/Products/Eclipse/JSEclipse/Overview/
中下载JSEclipse中下载JSEclipse_1.5.5.jar
2、Aptana
下载地址:http://www.aptana.com/studio/download
3、Spket
下载地址:http://www.spket.com/download.html
4、Dreamweaver插件
a.SpketDW:支持Dreamweaver 2004;
b.Spket DWCS:支持新版Dreamweaver CS3
下载地址:http://www.spket.com/dreamweaver-extension.html#cs3
5、Visual Studio 2008
Ext提示插件VSWD Ext 下载地址:
http://www.spket.com/ext-intellisense-visual-studio.html

十:ExtJS 调试工具
    以下是extjs.org.cn收集的一些开发调试的ExtJS开发工具,不管您是用ExtJs结合哪一种言,使用的是哪一个平台.你都可以在下面找到你需要的开发工具..
调试工具:调试ExtJs利器 - Firebug(Firefox插件)
调试ExtJs利器 - Microsoft Script Debug(官方IE插件)
调试ExtJs利器 - Full Source(IE插件)

转载于:https://www.cnblogs.com/sunliyuan/p/5806309.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
一、ExtJS 框架简介...............................................................................................................3 二、如何使用Ext.................................................................................................................. 3 三、Ext 组件......................................................................................................................... 4 1、组件简介...................................................................................................................4 2、组件XType............................................................................................................... 5 3、组件应用...................................................................................................................5 4、组件配置选项........................................................................................................... 6 5、组件属性...................................................................................................................7 6、组件方法...................................................................................................................8 四、事件及事件响应............................................................................................................. 8 五、Component 及Container 简介........................................................................................ 11 1、Ext.Component........................................................................................................ 11 2、Ext.Comtainer.......................................................................................................... 12 六、面板Ext.Panel.............................................................................................................. 12 面板Panel 简介............................................................................................................ 12 面板内容...................................................................................................................... 14 面板与DOM 节点DIV................................................................................................. 15 七、ViewPort....................................................................................................................... 16 八、窗口Window................................................................................................................ 18 九、对话框.......................................................................................................................... 20 十、TabPanel....................................................................................................................... 24 十一、布局.......................................................................................................................... 28 十二、表格Grid.................................................................................................................. 31 十三、TreePanel.................................................................................................................. 32 十四、表单Form................................................................................................................. 34 十五、理解Html DOM、Ext Element 及Component............................................................ 36 十六、Ext 类中的get 方法简介........................................................................................... 37 十七、如何学习及掌握Ext..................................................................................................39
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值