ExtJS學習(1):demo
ExtJS是一個用javascript寫的,主要用于創(chuàng)建前端用戶界面,是一個與后臺技術(shù)無關(guān)的前端ajax框架。ExtJS發(fā)布包目錄
adapter:負責將里面提供第三方底層庫(包括Ext自帶的底層庫)映射為Ext所支持的底層庫。
build: 壓縮后的ext全部源碼(里面分類存放)。
docs: API幫助文檔。
exmaples:提供使用ExtJs技術(shù)做出的小實例。
resources:Ext UI資源文件目錄,如CSS、圖片文件都存放在這里面。
source: 無壓縮Ext全部的源碼(里面分類存放) 遵從Lesser GNU (LGPL) 開源的協(xié)議。
Ext-all.js:壓縮后的Ext全部源碼。
ext-all-debug.js:無壓縮的Ext全部的源碼(用于調(diào)試)。
ext-core.js:壓縮后的Ext的核心組件,包括sources/core下的所有類。
ext-core-debug.js:無壓縮Ext的核心組件,包括sources/core下的所有類。
應(yīng)用extjs需要在頁面中引入extjs的樣式及extjs庫文件,樣式文件為resources/css/ext-all.css,extjs的js庫文件主要包含兩個,adapter/ext/ext-base.js及ext-all.js,其中ext-base.js表示框架基礎(chǔ)庫,ext-all.js是extjs的核心庫。adapter表示適配器,也就是說可以有多種適配器,因此,可以把adapter/ext/ext-base.js換成adapter/jquery/ext-jquery-adapter.js,或adapter/prototype/ext-prototype-adapter.js等。
index.jsp 代碼如下
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Ext welcome you</title>
<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"
src="extjs/build/locale/ext-lang-zh_CN.js"></script>
<script type="text/javascript">
//alert("Ext welcome you");
function btn() {
Ext.MessageBox.alert('ExtButton', 'ExtButton');
}
//Ext.onReady(btn);
Ext.onReady(
function () {
Ext.MessageBox.alert('ExtButton', 'ExtButton');
}
);
</script>
</head>
<body>
<h1>Ext welcome you</h1>
<div id="hello_in"> </div>
<script type="text/javascript">
var panel = new Ext.TabPanel( {
width :300,
height :200,
items : [ new Ext.Panel( {
title :"111111111",
height :30,
html :'<h1>Hello,aaaaaaaaaaaaaaaa</h1>'
}), new Ext.Panel( {
title :"2222222222",
height :30,
html :'<h1>Hello,bbbbbbbbbbbbbb</h1>'
}), new Ext.Panel( {
title :"33333333333333",
height :30,
html :'<h1>Hello,cccccccccccc</h1>'
}) ]
});
panel.render("hello_in");
</script>
</body>
</html>
柳德才
13691193654
18942949207
QQ:422157370
liudecai_zan@126.com
湖北-武漢-江夏-廟山
posted on 2009-01-16 14:47 liudecai_zan@126.com 閱讀(3637) 評論(2) 編輯 收藏 所屬分類: ExtJS