ExtJS2.0开发与实践笔记[0]——初识ExtJS
|
zhaoxq
老紫竹  
管理员
|
1 # 大 中 小 发表于 2008-04-29 12:07:56
简短的前言：
随着网络技术的发展，良好的用户体验及丰富的客户端功能已成为Web程序所共同追逐的目标，并扮演非常重要的一环。基于Ajax应用思想的盛行，prototype、ext、dojo、yui、mootools等越来越多的第三方开源Javascript Library开始涌现，虽然这极大地增加了我们对web应用的扩展可能性，但同时也或多或少的增加了我们的学习难度。 为此，我准备在blog中逐步整理学习心得，已备查找需要及看客指正。 什么是ExtJS? 按照Ext开发团队的说法，ExtJS从应用角度上讲是一个用户界面库，而不是一个JavaScript Library。原本作为Yahoo! UI Library(也就是YUI)的扩展而被开发出来，但从1.1版本开始由于支持者的增多，已经得到了必要的扩充，不再依赖于YUI。ExtJS可以与prototype.js和jquery等成熟的js库一起使用，也可以作为单独的应用部署到开发中去，Adobe AIR与iPhone开发工具都提供了对Ext的支持。 就我个人的观点而言，在业务处理上讲ExtJS2.0已非常完备，足以满足绝大多数web表示层应用的需求；但是对于解释执行的javascript来讲性能损耗问题却始终无法避免，因此个人不建议在要求响应速度的项目中使用ExtJS进行开发。 我们可以通过http://extjs.com/download来获得最新版本的ext框架 发展简史：
如何开发ExtJS2.0应用？ 针对ExtJS2.0，由于其通过浏览器解释执行，所以我们即可以使用记事本、EditPlus、UltraEdit等方式直接编辑文本文件，也可以通过IDE进行调试开发。 目前Eclipse上已经有很多能够支持ExtJS2.0的插件，如Spket等，此处不一一例举。 ExtJS2.0的“Hello World” 在Aptana中使用ExtJS2.0，我们至少需要ExtJS2.0中的如下文件：
首先，我们在helloworld.js中建立如下内容
/**
* 通过Ext输出Hello World,[Ext.onReady是ExtJS所定义的,当页面加载完毕之后,会自动调用
* Ext.onReady]
*
* @param {Object} ''
* @param {Object} 'Hello World!'
*/
Ext.onReady(function() {
//以Ext的alert打印'Hello World!'
Ext.MessageBox.alert('','Hello World!');
});而后，我们建立helloworld.html文件，内容如下
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>HelloExt</title>
<!--ExtJS资源加载-->
<link rel="stylesheet" type="text/css" href="resources/css/ext-all.css" />
<script type="text/javascript" src="adapter/ext/ext-base.js"></script>
<script type="text/javascript" src="ext-all.js"></script>
<!--我的js文件-->
<script type="text/javascript" src="helloworld.js"></script>
</head>
<body>
"ExtJS的Hello World测试"
</body>
</html>输出运行效果如下图
怎么样，超级简单，是人就会吧？下一回，我将针对ExtJS的特性开始做深入讲解 ext20_all.jpg 20080311_ext_extset.gif 20080311_ext_hello.gif
快乐渡过每一天，减肥坚持每一天
|
||||||||||||||||
|
