和我一起学ExtJS——入门

和我一起学ExtJS——入门

先从官方下载Extjs 2.0http://www.extjs.com/

在页面上导入所需的ＪＳ和ＣＳＳ资源文件

< html >
< head >
< meta  http-equiv ="content-type"  content ="text/html; charset=UTF-8"   />

< link  rel ="stylesheet"  type ="text/css"  href ="plugins/extjs/ext-2.0/resources/css/ext-all.css"   />
< style  type ="text/css" >
    @import url("plugins/extjs/ext-2.0/resources/css/ext-all.css");
</ style >
< script  type ="text/javascript"  src ="plugins/extjs/ext-2.0/adapter/ext/ext-base.js" ></ script >
< script  type ="text/javascript"  src ="plugins/extjs/ext-2.0/ext-all.js" ></ script >
</ head >
< body >
< div  id ="id1"  style ="border:1px solid red;height:200px;width:200px;" > id1的范围，请用mouse 左键点击 </ div >
< div  id ="id2"  style ="border:1px solid red;height:200px;width:200px;" > id2的范围，请用mouse 左键点击 </ div >

来一个实例，最常见的ID元素操作
传统的操作：

< script type = " text/javascript " >
     var  d = document.getElementById( " id1 " );
    d.onclick = function () {
        alert("你点击了id1");
    }

Extjs里的实现：

     var  t = Ext.get('id2');
    t.center();
    t.on('click', function () {
        alert("dfsdfsd");
        t.highlight();
    } , this ,
     {single: false,
    delay: 100}
    );
});
</ script >
</ body >
</ html >

如果使用easyjweb就可以直接用以下代码了

< html >
< head >
< meta  http-equiv ="content-type"  content ="text/html; charset=UTF-8"   />
$html.extjs2()
< title > 跟我一起学Extjs——入门 </ title >
</ head >
< body >
< div  id ="id1"  style ="border:1px solid red;height:200px;width:200px;" > id1的范围，请用mouse 左键点

击 </ div >
< div  id ="id2"  style ="border:1px solid red;height:200px;width:200px;" > id2的范围，请用mouse 左键点

击 </ div >
< script  type ="text/javascript" >
Ext.onReady(function(){
    var t=Ext.get('id2');
    t.center();
    t.on('click',function(){
        alert("dfsdfsd");
        t.highlight();
    },this,
    {single: false,
    delay: 100}
    );
});
</ script >
< script  type ="text/javascript" >
    var d=document.getElementById("id1");
    d.onclick=function(){
        alert("你点击了id1");
    }
</ script >
</ body >
</ html >