提供最新Ext的下载地址:
http://www.sencha.com/products/extjs/download/
下载后解压,docs目录是它的APi文档,example目录是它的示例
先来个最easy的helloworld:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8"> <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> <title>ExtJs Study</title></head><body>
<script type="text/javascript">
Ext.onReady(function() {
//定义一个函数,功能为弹出一个对话框
var fHelloWorld = function(){
Ext.MessageBox.show({
title: "ExtJs Study",
msg: "Hello World",
width: 200,
buttons: Ext.MessageBox.OK
});
}
//这就是Ext获取页面元素的方法,简单吧
var oBtnHello = Ext.get("btnHello");
//将元素居中
oBtnHello.center();
//为元素动态增加Click事件
oBtnHello.on("click", fHelloWorld) });
</script><button id="btnHello">Hello World</button>
</body>
</html>
所有功能都是在Ext.onReady中完成的,用了几个简单的方法,Ext.get取页面指定ID的元素,center()将对象居中,MessageBox.show显示对话框
最后显示的图示:

- 大小: 31 KB
分享到:
相关推荐
ExtJS 学习笔记 ExtJS 是一个功能强大且流行的 JavaScript 库,用于构建富互联网应用程序(RIA)。本文将通过一个简单的示例,介绍如何使用 ExtJS 构建一个 Hello World 网页,并且详细讲解 Ext.MessageBox 的使用...
首先,ExtJS的"Hello World"示例通常涉及到引入必要的库文件。在开始使用ExtJS之前,你需要从官方网站(http://extjs.com/products/extjs/download.php)下载框架的最新版本。解压后,你会看到包含adapter、build、...
1. **创建JS文件**:在WebRoot目录下创建`helloworld.js`,编写基本的应用结构: ```javascript Ext.application({ name: 'HelloExt', launch: function () { Ext.create('Ext.container.Viewport', { layout:...
以上知识点涵盖了ExtJS学习笔记中的核心内容,通过这些知识点的学习和实践,开发者能够入门并逐渐深入理解ExtJS框架,并将这些知识应用到实际的开发工作中去。对于希望深入学习ExtJS的开发者来说,理解这些基础知识...
在`Hello World`示例中,我们看到HTML文档包含了几个重要的引用,包括ExtJS的基础样式表`ext-all.css`和JavaScript库文件`ext-base-debug.js`和`ext-all-debug.js`。这些文件的顺序非常重要,因为它们定义了ExtJS...
2. **编译**: 执行 `javac HelloWorld.java`。 3. **运行**: 使用 `java HelloWorld`。 ### JDK 安装与配置 1. **下载**: 访问 Sun Microsystems 的官方网站下载 JDK。 2. **安装**: 按照提示完成安装过程。 3. **...
JQuery学习基础学习笔记为我们提供了一个全面认识和了解JQuery的机会,JQuery是一个快速、小巧且功能丰富的JavaScript库。它简化了HTML文档遍历和事件处理、DOM操作、动画以及Ajax交互,从而加速了web开发过程。 ...