ExtJs学习笔记(1)---ExtJs安装及其使用
来源:互联网 发布:qq农场刷级软件 编辑:程序博客网 时间:2024/04/28 02:22
从官网下载了ExtJs的3.2版本的SDK,包含了代码依赖的详细说明、文档、范例和其他文件。其中,adapter和resources文件是Ext正常运行所必须的,其他的仅在开发过程中使用到。
Adapter:支持把Ext和其他代码库一同使用的文件
build:用于自定义构建ext-all.js的文件
docs:文档中心(仅当运行在服务器上时能够正常访问)
examples:大量令人印象深刻富有洞察力的范例
resources:Ext依赖的文件,例如CSS和图片
source:ext的所有代码
在使用Ext之前,我们需要现在页面中引入Ext的库文件,为了达到这个目的,我们需要在HTML页面的head标签区域内引入刚才下载的SDK文件。
<html><head><title>ExtJs起步</title><link rel="stylesheet" type="text/css" href="lib/extjs/resources/css/ext-all.css" /><script src="lib/extjs/adapter/ext/ext-base.js"></script><script src="lib/extjs/ext-all-debug.js"></script></head><body><!--nothing in the body--></body></html>Ext文件的引用路径必须是正确的,并且是HTML页面的相对路径。这些文件必须依赖一下的顺序一次引入。
1.ext-all.css Ext中主要的CSS文件
2.外部JS库文件 如果有需要可以引入
3.ext-base.js Ext代码库的“适配器”
4.ext-all.js或者ext-all-debug.js 主要的Ext代码库文件
5.在这个位置引入主题文件,也可以在Ext主要的CSS文件引入后的任意位置引用。
前提知识已经准备完毕了,开始进行我们的第一个ExtJs页面的编写了。
<html><head><title>ExtJs起步</title><link rel="stylesheet" type="text/css" href="lib/extjs/resources/css/ext-all.css" /><script src="lib/extjs/adapter/ext/ext-base.js"></script><script src="lib/extjs/ext-all-debug.js"></script><script>Ext.onReady(function(){Ext.Msg.alert('Beyole','Hello World');});</script></head><body><!--nothing in the body--></body></html>
程序截图:
效果还是很好看的,而且这个对话框是可以随意拖拽的,当然只限制在页面的区域内,因为这毕竟不是真正的对话框,而是一系列DIV标签和图片的组合模拟而成的。这样以后写出的HTML的前台效果就很好了。
0 0
- ExtJs学习笔记(1)---ExtJs安装及其使用
- ExtJs 学习笔记1
- ExtJS学习笔记1--onReady
- dojochina ExtJS学习笔记1
- Extjs学习笔记(1)
- ExtJs学习笔记(XTemplate的使用)
- Extjs学习笔记----------Panel的使用
- eXTJS学习笔记
- extJs 2.0学习笔记
- extjs学习笔记--- 实战
- ExtJs组件学习笔记
- extjs学习笔记
- ExtJS 学习笔记
- extjs 学习笔记
- 《extjs 学习笔记一》
- extjs学习笔记
- extjs学习笔记续
- ExtJs学习笔记
- 交错数组
- 怀念,那淅沥的雨
- Linux 文本界面与图形界面互相切换
- 有关 腾讯iOS手游
- Decode the tape - UVa 10878 找规律
- ExtJs学习笔记(1)---ExtJs安装及其使用
- 一个程序员的拧巴阶段(一)
- 如何在ubuntu下查看隐藏的文件和文件夹
- C# Interlocked类的事例
- python版的短信轰炸机smsbomb----------下篇(get)
- Codeforces Round #249 (Div. 2) A B C
- 机房收费系统——可行性分析报告
- LeetCode 解题
- Mysql分页存储过程