ExtJS 入门

开始...
在ExtJS里最常用的,应该就是Ext.onReady那几个方法了,而且它也说不定是您学习ExtJS所接触的首先个点子,那个办法在当前的DOM加载达成后自行调用,保险页面内的具备因素都能被Script所援用.能够品尝在那一个措施中加多一条语句,看看页面展开后是什么样反映:

复制代码 代码如下:

Ext.onReady(function() {
alert('hello world!');
});

下面的代码将要页面加载实现后弹出一对话框,打字与印刷出'hello world!'字样.
收获成分 还应该有多少个常用的点子,就是赢得页面上的因素了,ExtJS提供了叁个get方法,能够根据ID取到页面上的成分:
var myDiv = Ext.get('myDiv');
会取到页面上ID为'myDiv'的成分.假使采纳Element.dom的格局,则足以间接操作底层的DOM节点,Ext.get再次回到的则是三个Element对象.
在不能使用这种方法来获得七个DOM的节点,或是要收获一些ID不雷同,但又有雷同特征的时候,能够透过选用器来张开获取,例如要取得页面上独具的
标签,则能够动用:
var ps = Ext.select('p');
这么您就足以对所要获取的元素进行操作了,select()方法再次回到的是Ext.CompositeElement对象,能够通过中间的each()方法对其所富含的节点开展遍历:

复制代码 代码如下:

ps.each(function(el) {
el.highlight();
});

本来,尽管您只要对获得的具备因素进行一样的操作,能够直接选拔于CompositeElement对象上,如:
ps.highlight();
或是:
Ext.select('p').highlight();
理所当然,select参数还足以更目迷五色一些,当中能够富含W3C Css3Dom选拔器,基本的XPath,HTML属性等,详细景况,能够查看DomQuery API的文书档案,来询问细节.
事件响应 赢获得了元素,则恐怕会对有的要素的风波进展一些管理,举个例子获取多个开关,大家为它增多二个单击事件的响应:

复制代码 代码如下:

Ext.onReady(function() {
Ext.get('myButton').on('click', function() {
alert('You clicked the button!');
});
});

当然,你能够把事件的响应加到通过select()方法得到到的成分上:

复制代码 代码如下:

Ext.select('p').on('click', function() {
alert('You clicked a paragraph!');
});

Widgets
ExtJS还提供了拉长的UI库来供大家使用.
新闻窗口 将前方的alert()方法替换一种ExtJS提供的方案:

复制代码 代码如下:

Ext.onReady(function() {
Ext.get('myButton').on('click', function() {
alert('You clicked the button!');
});
});

本文由华夏彩票发布于计算机网络,转载请注明出处:ExtJS 入门

您可能还会对下面的文章感兴趣: