Extjs開發環境

配置Extjs開發環境很簡單的，完全可以在Html靜態頁面運行，需要的開發工具也很簡單。 步驟如下： 1：到官方網站http://www.extjs.com/products/extjs/download.php下載必要的核心包。 2：解壓Extjs3.1.rar檔案(本人用的是3.1版本)。 3：在Html頁面中引入相應檔案，如下： Java代碼 <link rel="stylesheet" type="text/css" href="../Ext/resources/css/ext-all.css">   <script type="text/javascript" src="../Ext/ext-base.js"></script>   <script type="text/javascript" src="../Ext/ext-all.js"></script>    <link rel="stylesheet" type="text/css" href="../Ext/resources/css/ext-all.css"><script type="text/javascript" src="../Ext/ext-base.js"></script><script type="text/javascript" src="../Ext/ext-all.js"></script>    ext-all.css 是樣式檔案。    ext-base.js 是Extjs的基礎包必須放在ext-all.js的前面。    ext-all.js 是Extjs的核心包。 4：開始建立一個Extjs的Window組件。 代碼如下： Js代碼 <script type="text/javascript">                  Ext.onReady(function(){               var win = new Ext.Window({                   title : "Ext.Window",                   resizable : false,                   width : 350,                   height : 300,                   html : "Hi, my name is Ext.Window!",                   buttonAlign : "center",                   buttons : [{text:"setTitle"},{text:"close"}]               });               win.show();           });   </script>   <script type="text/javascript">                            Ext.onReady(function(){                        var win = new Ext.Window({                                title : "Ext.Window",                                resizable : false,                                width : 350,                                height : 300,                                html : "Hi, my name is Ext.Window!",                                buttonAlign : "center",                                buttons : [{text:"setTitle"},{text:"close"}]                        });                                                win.show();                });</script> 代碼解釋：Ext.onReady(),Extjs的代碼都放在裡面進行解釋執行，這是必須的。在裡面var一個Ext.Window,然後調用一個show方法，就這麼簡單，Window就出來的。(下一章將結合API對本例子進行API解釋，可以讓大家熟悉API的使用)

本文轉自www.35java.com