Extjs4.2入门(1)

这篇博客介绍了ExtJS4.2的基础知识,包括如何获取框架、理解其特性、安装Firebug调试工具,选择合适的编辑器以及创建第一个Ext项目,适合初学者入门。

摘要生成于 C知道 ,由 DeepSeek-R1 满血版支持, 前往体验 >

Extjs是一款重量级的javascript框架,与jQuery不同的是,Extjs是一套完整的框架,可以完全用Extjs构建一个网站,而jQuery却比较零散,使用更为灵活。

(1)获取ExtJS

我们可以从 Sencha的官网获取到ExtJS。当然,由于ExtJS并不是免费的,所以我们只能下载GPL版本的

(2)了解ExtJS

下载得到的压缩包解压后我们会得到ExtJS许多文件,其中有个 index.html文件,打开后,我们可以看到以下界面

通过这个目录,我们可以点击API Docs查看API文档,View the Examples查看ExtJS所给出的一些案例(源代码在examples目录下),ExtJS给出的学习指南,这些都是很有用的.
而目录下的resources文件夹以及ext-all.js文件是主要的。ext-debug.js与ext-all.js不同的是,ext-debug.js是没有经过压缩不完整的,ext-all.js包含了所有的组件但是确实压缩过的(),若使用
ext-debug.js时没有在头部引入所需要的库文件(就像C++的include)时,就会导致出错。

(3)安装Firebug

firebug是一款js调试利器,可以在Firefox上按F12显示出调试信息,如果出错并告诉你错误在代码的第几行。
如果使用的是Chrome浏览器,则需要安装的一个插件叫FireLite(其实和Firebug是同一个东西)

(4)编辑器的选择

写ExtJS,其实用Eclipse比较好,只需安装一个叫Skpet的东西就好了,而且是免费的。如果使用Jetbrains系列的工具,只需要在插件中搜索Sencha,并进行下载就可以了(好像是30天试用期),sublime也是一个不错的选择

(5)新建第一个Ext项目

在解压的ExtJS文件目录下,新建一个html,编辑其中的文字
<!DOCTYPE html>
<html lang="en">
<head>
	<meta charset="UTF-8">
	<title>Document</title>
	<script type="text/javascript" src="ext-all.js"></script>
	<!-- 加载ExtJS组件 -->
	<script>
		Ext.application({
			name:'HelloWorldText',
			launch:function(){
				Ext.create('Ext.container.Viewport',{
					layout:'fit',
					items:[
					{
						html:'Hello ExtJS!'
					}
					]
				});
			}
		});
	</script>
	<!-- ExtJS函数 -->
</head>
<body>
</body>
</html>
双击运行文件,若出现“Hello ExtJS”,则表示创建项目成功,你已经步入了ExtJS的大门了



评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值