为了方便表示或是指定一个组件的名称,我们通常会使用id或者itemId进行标识命名。(推荐尽量使用itemId,这样可以减少页面唯一标识而产生的冲突)


id:

  id是作为整个页面的Component的唯一标识,这也意味着在整个页面中只允许有唯一一个名称的id,同时这里的Component的id也将变为element中的id,所以如果出现了两个,页面将会出现崩塌变形等等不可以想象的问题。

  而作为一个组件是必须有自己的唯一标识(id)的,在没有设置Component的id的时候系统将自动为组件添加id



itemId:

  itemId是用于container底下的元件的,这也说明itemId只是一个局部的元件标识名称,在全局上是不需要遵循唯一性的。
   从上面的叙述中可以看出一些使用上需注意的地方
  1. 若你要取得相关的Component 若是属于container 请设置id

  2. 若是只属于某个container 底下的元件,请设置itemId;某些情况下当然你也可以连同id 一起设置,比如需要改变css style,除此之外itmeid 还是优先的选择

  3. getCmp 以及getComponent 是不一样的,使用上必须注意,必须搭配id 以及itemid 使用

如此一来id 与itemid 就会有从属关系,非必要不需定义id,也不会造成在定义id 时需要编码避免重覆,而因为itemid 是属于某个id 底下的,所以即使itemid 重覆,也可以利用唯一的id 利用Ext.getCmp 取得参照后,在接着使用getComponent
取得所属itemId 的参照。

怎么获取id和itemId的组件和元件(从以上可以明显的看出,itemId是个局部的元件名称):

id: Ext.getCmp(id);

itemId:Ext.getCmp(id).getComponent(itemId);

再看一段代码

var c = new Ext.panel.Panel({
height: 300,
renderTo: document.body,
layout: 'auto',
items: [
{
itemId: 'p1',
title: 'Panel 1',
height: 150
},
{
itemId: 'p2',
title: 'Panel 2',
height: 150
}
]
})
p1 = c.getComponent('p1');
p1 = c.child('#p1'); p2 = p1.ownerCt.getComponent('p2');
p2 = p1.ownerCt.child('p2');

p1,p2中的itemid换成id,用p1 = c.child('#p1')方式获取; 同样也是可以获取到的,但肯定不合适,

你可以想象下,如果你再创建了一个c呢,id就重复了。

我们可以简单的理解为id是全局变量,itemid是局部变量

ExtJs4学习(四):Extjs 中id与itemId的区别的更多相关文章

  1. 【转载】Extjs 中id与itemId的区别

    为了方便表示或是指定一个组件的名称,我们通常会使用id或者itemId进行标识命名.(推荐尽量使用itemId,这样可以减少页面唯一标识而产生的冲突) id:        id是作为整个页面的Com ...

  2. ExtJs4学习(四):Extjs 中id与itemId的差别

       为了方便表示或是指定一个组件的名称,我们一般会使用id或者itemId进行标识命名. (推荐尽量使用itemId.这样能够降低页面唯一标识而产生的冲突) id:   id是作为整个页面的Comp ...

  3. html元素中id和name的区别

    可以说几乎每个做过Web开发的人都问过,到底元素的ID和Name有什么区别阿?为什么有了ID还要有Name呢?! 而同样我们也可以得到最classical的答案:ID就像是一个人的身份证号码,而Nam ...

  4. html中id name class的区别(转)

    HTML 中 id与name 区别 一个name可以同时对应多个控件,比如checkbox和radio 而id必须是全文档中唯一的 id的用途 1) id是HTML元素的Identity,主要是在客户 ...

  5. 在表单(input)中id和name的区别

    但是name在以下用途是不能替代的: 1. 表单(form)的控件名,提交的数据都用控件的name而不是id来控制.因为有许多name会同时对应多个控件,比如checkbox和radio,而id必须是 ...

  6. html css中id和class的区别比较

    在定义样式的时候,有时候会将id和class的用法弄混淆,所以在这里特意说明一下: id和class属性是网页中两个通用的属性,它们协同工作使整个页面变得丰富多彩.当我们为一个元素定义样式时.可以使用 ...

  7. 在表单(input)中id和name的区别

    但是name在以下用途是不能替代的:1. 表单(form)的控件名,提交的数据都用控件的name而不是id来控制.因为有许多name会同时对应多个控件,比如checkbox和radio,而id必须是全 ...

  8. HTML中Id和Name的区别

    源地址:http://www.cnblogs.com/laodai/articles/2244215.html 在html中:name指的是用户名称,ID指的是用户注册是系统自动分配给用户的一个序列号 ...

  9. 属性中id和name的区别

    id 在HTML中的作用:      1.用id选择相应的style sheet(风格).       2. <A ..> 链接的目的地      3.脚本语言用它找目的地(找该id的标签 ...

随机推荐

  1. Centos 7 进入单用户模式更改root密码方法

    进入单用户模式的方法 方法一: 1.开机进入grub菜单的时候上下选择,按e编辑. 到linux16所在行的最后面. ro 只读文件系统 biosdevname=0 戴尔的服务器需要设置 net.if ...

  2. ChromiumWebBrowser 禁用右键菜单

    /// <summary>    /// 禁用嵌套页面的右键菜单    /// </summary>    public class MenuHandler : IContex ...

  3. 聊聊 Spring 的 XML Schema 扩展机制的使用方式

    前言 在当前Java生态,Spring算的上是最核心的框架,所有的开发组件想要得到大范围更便捷的使用,都要和Spring进行整合,比如我们熟知的Mybatis.Dubbo等,以及内部封装的各类组件包括 ...

  4. Pandas之:Pandas高级教程以铁达尼号真实数据为例

    Pandas之:Pandas高级教程以铁达尼号真实数据为例 目录 简介 读写文件 DF的选择 选择列数据 选择行数据 同时选择行和列 使用plots作图 使用现有的列创建新的列 进行统计 DF重组 简 ...

  5. Docker学习(11) Dockerfile指令

    Dockerfile指令 指令格式 FROM MAINTAINER RUN EXPOSE CMD ENTRYPOINT ADD COPY VOLUME WORKDIR ENV USER ONBUILD ...

  6. Jittor实现Conditional GAN

    Jittor实现Conditional GAN Generative Adversarial Nets(GAN)提出了一种新的方法来训练生成模型.然而,GAN对于要生成的图片缺少控制.Conditio ...

  7. Ascend Pytorch算子功能验证

    Ascend Pytorch算子功能验证 编写测试用例 以add算子为例,测试脚本文件命名为:add_testcase.py.以下示例仅为一个简单的用例实现,具体算子的实现,需要根据算子定义进行完整的 ...

  8. Java Spring boot 多商户入驻 外卖|跑腿|代驾 Uniapp版本

    技术说明: 源码下载:https://www.yuanmahy.com/8357.html 开发环境:jdk1.8,mysql5.7,node 9.4,redis6.2,npm6.9 开发工具:前端使 ...

  9. UF 公共类型

    Open C uc4400uc4403uc4404uc4406uc4409uf3192uf4401uf4402UF_add_callback_functionUF_allocate_memoryUF_ ...

  10. Java 垃圾回收机制,13张图给你讲清楚

    什么是自动垃圾回收? 第一步:标记 第二步:清除 压缩 为什么需要分代垃圾收集? JVM 分代 世代垃圾收集过程 什么是自动垃圾回收? 自动垃圾回收是一种在堆内存中找出哪些对象在被使用,还有哪些对象没 ...