〖ExtJS〗介绍和简单HelloWorld例子

ExtJS基于AJAX框架，用Javascript写的，用于在客户端创建丰富多彩的WEB应用程序界面。

在项目中使用ExtJS之前，应把对应的包adapter，resources和文件ext-all.js导入到项目中！在下面的附件中包含有！

 

以下是ExtJS运用的简单例子，Helloworld，漂亮的Panel和分布

 

代码一：sample.html

< !DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" >
< html >
   < head >
     < title >sample.html </title>
  
     < meta http-equiv ="keywords" content ="keyword1,keyword2,keyword3" >
     < meta http-equiv ="description" content ="this is my page" >
     < meta http-equiv ="content-type" content ="text/html; charset=UTF-8" >
    
     < link rel ="stylesheet" type ="text/css" href ="./scripts/ext/resources/css/ext-all.css" >
     < script type ="text/javascript" src ="./scripts/ext/adapter/ext/ext-base.js" > </script>
     < script type ="text/javascript" src ="./scripts/ext/ext-all.js" > </script>
     < script type ="text/javascript" src ="./scripts/demo/sample.js" > </script>
   </head>
  
   < body >
   < div id ="hello" > </div>
   </body>
</html>

 

代码二：sample.js

Ext.onReady( function(){
//    Ext.Msg.alert("Helloworld");//弹出窗口Helloworld
//    var panel = new Ext.Panel({ //生成漂亮的Panel
//  id:'panle_hello',
//  title:'hellotitle',
//  width:400,
//  height:500
//    });
//    panel.render("hello");
     var viewport = new Ext.Viewport({ //漂亮的布局
  id:'desk',
  layout:'border',
  items:[{region:'north',height:50},{region:'west',width:200},{region:'center'}]
    })
});

 

项目中所需文件在附件中包含有，其它的内容可以去 [url]www.extjs.com[/url] 下载