`
langgufu
  • 浏览: 2290292 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

Ext中的get、getDom、getCmp、getBody、getDoc的区别 (转)

阅读更多

Ext 中包含了几个以 get 开头的方法,这些方法可以用来得到文档中 DOM 、得到当前文档中的组件、得到 Ext 元素等,在使用中要注意区别使用。
1
get 方法
get
方法用来得到一个 Ext 元素,也就是类型为 Ext.Element 的对象, Ext.Element 类是 Ext DOM 的封装,代表 DOM 的元素,可以为每一个 DOM 创建一个对应的 Element 对象,可以通过 Element 对象上的方法来实现对 DOM 指定的操作,比如用 hide 方法可以隐藏元素、 initDD 方法可以让指定的 DOM 具有拖放特性等。 get 方法其实是 Ext.Element.get 的简写形式。
get
方法中只有一个参数,这个参数是混合参数,可以是 DOM 节点的 id 、也可以是一个 Element 、或者是一个 DOM 节点对象等。看下面的示例代码:

Ext.onReady(function(){
var e=new Ext.Element("hello");
alert(Ext.get("hello"));
alert(Ext.get(document.getElementById("hello")));
alert(Ext.get(e));
});
Html
页面中包含一个 id hello div ,代码如下:
<div id="hello">tttt</div>

Ext.get("hello")
Ext.get(document.getElementById("hello")) Ext.get(e) 等三个方法都可以得到一个与 DOM 节点 hello 对应的 Ext 元素。
2
getCmp 方法-获得 Ext 组件。
getCmp
方法用来获得一个 Ext 组件,也就是一个已经在页面中初始化了的 Component 或其子类的对象, getCmp 方法其实是 Ext.ComponentMgr.get 方法的简写形式。 getCmp 方法中只有一个参数,也就是组件的 id 。比如下面的代码:

Ext.onReady(function(){
var h=new Ext.Panel({
id:"h2",
title:"
  ",
renderTo:"hello",
width:300,
height:200});
Ext.getCmp("h2").setTitle("
新的标题 ");
});

在代码中,我们使用 Ext.getCmp("h2"). 来得到 id h2 的组件,并调用其 setTitle 方法来设置该面板的标题。
3
getDom 方法-获得 DOM 节点
getDom
方法能够得到文档中的 DOM 节点,该方法中包含一个参数,该参数可以是 DOM 节点的 id DOM 节点对象或 DOM 节点对应的 Ext 元素 (Element) 等。比如下面的代码:

Ext.onReady(function(){
var e=new Ext.Element("hello");
Ext.getDom("hello");
Ext.getDom(e);
Ext.getDom(e.dom);
});
Html

<div id="hello">tttt</div>

在上面的代码中, Ext.getDom("hello") Ext.getDom(e) Ext.getDom(e.dom) 等三个语句返回都是同一个 DOM 节点对象。
4
getBody 方法-得到文档的 body 节点元素 (Element)
该方法直接得到文档中与 document.body 这个 DOM 节点对应的 ExtJS 元素( Element ),实质就是把 document.body 对象封装成 ExtJS 元素对象返回,该方法不带任何参数。比如下面的代码把面板 h 直接渲染到文档的 body 元素中。

Ext.onReady(function(){
var h=new Ext.Panel({title:"
测试 ",width:300,height:200});
h.render(Ext.getBody());
});

5
getDoc 方法-获得与 document 对应的 Ext 元素 (Element)
getDoc
方法实质上就是把当前 html 文档对象,也就是把 document 对象封装成 ExtJS Element 对象返回,该方法不带任何参数。

分享到:
评论

相关推荐

    extjs 常用函数.rar

    extjs 常用函数 getCMP() getDom()

    Ext GridPanel导出Excel(改进)

    将页面的GridPanel中的数据导出到Excel中 测试Ext:版本2.2.1 支持GridSummary,GroupSummary和GroupHeaderPlugin插件 使用方法: 1)把三个JS文件引入到页面中 ...data2Excel.export2Excel(Ext.getCmp('listSet'));

    ExtJSWeb应用程序开发指南(第2版)

    6.2.6 Ext.getDom() 6.2.7 Ext.isEmpty() 6.2.8 Ext.namespace() 6.2.9 Ext.each() 6.2.1 0Ext.apply() 6.2.1 1Ext.encode() 6.2.1 2Ext.htmlDecode() 6.2.1 3Ext.typeOf() 6.3 Ext.core....

    Extjs中ComboBox加载并赋初值的实现方法

    Ext.getCmp(‘city-id-name’).setValue(cityid); 由于是store是异步加载的,所以他会先赋值再填充值到ComboBox,,这里就需要用: 当加载完成后再进行赋值 : 复制代码 代码如下: editCityStore.load({ params: { ...

    ExtJs3.0中Store添加 baseParams 的Bug

    代码如下: this.store.on(‘beforeload’, function() { Ext.apply(Ext.getCmp(“propTypeGrid”).store.baseParams, { 参数1: ‘111’, 参数2: ‘111’ }); }); 但是在 3.0 中这样无法增加参数,于是在 ExtJs官方...

    extjs表单提交例子

    Ext.getCmp("msgBasicMsg").getForm().submit({ url : 'insertMsg.action?msgBean=' + formData, //等待时显示 等待 waitTitle : '请稍等...', waitMsg : '正在提交信息...', params : { msgBean:Ext.encode...

    Extjs 3.3切换tab隐藏相应工具栏出现空白解决

    Ext.getCmp(‘Tab2’).tbar.dom.style.height = ‘0px’; //显示 Ext.getCmp(‘Tab2’).tbar.show(); Ext.getCmp(‘Tab2′).tbar.dom.style.height = ’27px’;//高度可以自己定义 搞定,so easy!

    ExtJs Excel导出并下载IIS服务器端遇到的问题

    我们可以通过Ext.getcmp()方法获取到GridPanel对象并通过重写的方法获取Excel字符串具体方法可以百度到。这个应该也不是什么大问题。 代码如下: //输出报表 function ExportReport(title) { var vExportContent = ...

    ExtJS4给Combobox设置列表中的默认值示例

    这个是model 代码如下: Ext.regModel(‘commemModel’, { fields : [ ‘name’, ‘id’ ] }); 定义一个store设置id为s1的容器的默认值是 第一季度 代码如下: var ...function(){ Ext.getCmp(‘s1’).setValue(‘q1’);

    ExtJS 工具栏 分页事件参数

    例如:载入第一页的时候 代码: 代码如下: store.load({params:{start:0,limit:pageSize,Keyword:Ext.getCmp(‘input_name’).getValue()}}); 当单击下一页(上一页)时带参数 代码如下: doLoad : function(start){ ...

    学习ExtJS TextField常用方法

    三、函数 getCmp(string _id):得到id为_id的组件对象。 getValue():得到文件框值。 四、其它 layout:只在在此布局下才能正确显示文件框的标签名,布局的宿主对象必面 是Ext.Container或者Ext.Container的子类。 ...

    ExtJs 表单提交登陆实现代码

    1 在子类中添加单击提交事件 代码如下: //登陆按钮单击事件 loginFun: function() { var f = Ext.getCmp(“loginForm”); //表单验证 if (f.form.isValid) { f.form.submit({ waitTitle: “请稍候”, waitMsg: ...

    ExtJS如何设置与获取radio控件的选取状态

    获取 代码如下: function IsChecked(radioId) { return Ext.getCmp(radioId).checked; } 设置 代码如下: function SetRadio(radioId, isChecked) { Ext.getCmp(radioId).setValue(isChecked);//或者setValue(“on”)...

    datastore:数据服务提供商

    API兼容ExtJS的跨域Ajax请求,可以完全舍弃后端,客户端Ajax在回调中直接处理返回值的前台UI业务逻辑, 调用例子如下: Ext.data.JsonP.request({ url: 'http://192.168.81.33:8090/datastore/do/'+Ext.getCmp('...

    Js操作树节点自动折叠展开的几种方法

    //增加选择树,节点自动折叠 tree.on(“click”, function(node,e){ node.getUI().toggleCheck(true); }); tree.root.expand(); 2、方法二 代码如下: var tree = L5.getCmp(‘orgstrutree’); //增加选择树,节点...

    EXTJS FORM HIDDEN TEXTFIELD 赋值 使用value不好用的问题

    遇到一个很奇怪的问题,ExtJs里的form提交创建的时候从session里取... 先说说我的解决方法 给hidden组件加个ID 然后在form提交的时候 触发个方法使Ext.getCmp(‘ID’).setValue(userId); 生效。就可以把数据提交上去了

    gridpanel动态加载数据的实例代码

    代码如下:[removed]function editEsOrder(options,success,response){if (success){var tagModelManager_maxOrderIdJson=Ext.util.JSON.decode...Ext.getCmp(‘esorder’).setValue(orderValue) ;}}var tagModelManager

Global site tag (gtag.js) - Google Analytics