`

Ext.Component 和 Ext.Element 的区别

    博客分类:
  • ext
阅读更多
    Html DOM、Ext Element及Component三者之间的区别(Ext入门基础)

    每一个HTML页面都有一个层次分明的DOM树模型,浏览器中的所有内容都有相应的DOM对象,动态改变页面的内容,正是通过使用脚本语言来操作DOM对象实现。(通常使用getElementById/Ext.getDOM获得DOM对象)

    仅仅有DOM是不够的,比如要把页面中的某一个节点移到其它位置,要给某一个节点添加阴影效果,要隐藏或显示某一个节点等,我们都需要通过几句 javascript才能完成。因此,Ext在DOM的基础上,创建了Ext Element,可以使用Element来包装任何DOM,Element对象中添加了一系列快捷、简便的实用方法。(通常使用Ext.getEl()获得Element对象)

    对于终端用户来说,仅仅有Element是不够的,比如用户要显示一个表格、要显示一棵树、要显示一个弹出窗口等。因此,除了Element以外,Ext 还建立了一系列的客户端界面组件Component,我们在编程时,只要使用这些组件Componet即可实现相关数据展示及交互等,而 Component是较高层次的抽象,每一个组件在渲染render的时候,都会依次通过Element、DOM来生成最终的页面效果。(通常使用Ext.getCmp()获得Component对象)

================================================================

和Jquery一样,Ext.Element对象是对dom对象的封装,目的是为了跨平台以及增加一些有用的方法。但是Ext.Element是不包含外观的,封装的dom原来是怎么样就是怎么样。开发中最好有现成的组件可以使用,否则Extjs和Jquery差别真的不大了。因此Ext在Element的基础上进一步封装,产生了Component类,这些类含有外观,也就是多加入了一些html之类的进去,更方便开发者使用。

依赖关系如下:
Component=>Element=>dom
因此在Component中可以通过el属性来访问该Component所依赖的Element,同样的,Element也可以通过dom属性来访问Element对象所依赖的dom。


















-
引用地址:
http://www.cnblogs.com/shanmu/archive/2011/08/19/2145895.html
http://www.haogongju.net/art/1048391
分享到:
评论

相关推荐

    Ext Js权威指南(.zip.001

    6.5.2 ext.dom.compositeelement与ext.dom.compositeelementlite的区别 / 279 6.5.3 操作元素集合 / 279 6.6 综合实例:可折叠的面板accordion / 280 6.7 本章小结 / 283 第7章 数据交互 / 284 7.1 数据交互...

    Ext.ux.callout.Callout:CSS样式的浮动标注容器,带有可选箭头,可与Ext JS 4.0+一起使用

    相对于目标Ext.Element或Ext.Component定位自身,以及当目标移动或浏览器调整大小时,它将保持相对位置 响应鼠标超出标注范围时自动隐藏自身 可配置的延迟后自动关闭 显示时淡入,隐藏时淡出 因为一个Ext.ux....

    ExtJS快速入门指南.pdf

    十五、理解Html DOM、Ext Element 及Component............................................................ 36 十六、Ext 类中的get 方法简介....................................................................

    Ext 学习中文手册

    本文将简单地介绍Ext的几个基本概念,和如何快速地做出一个动态的页面并运行起来,假设读者已具备了一些JavaScript经验和初级了解HTML Dom。 目 录 EXT 中文手册 1 EXT简介 3 目錄 3 下载Ext 4 开始! 4 Element:...

    EXT简体中文参考手册(PDF&CHM电子档)

    Element:Ext的核心 4 获取多个DOM的节点 5 响应事件 5 使用Widgets 7 使用Ajax 9 EXT源码概述 11 揭示源代码 11 发布Ext源码时的一些细节 12 我应该从哪里开始? 13 适配器Adapters 13 核心Core 13 Javascript中的...

    EXT 中文帮助手册

    组件模型 Component Model 74 容器模型Container Model 78 布局 Layouts 80 Grid 82 XTemplate 83 DataView 84 其它新组件 84 EXT2简介 85 下载Ext 85 开始! 85 Element:Ext的...

    EXT 中文手册

    组件模型 Component Model 74 容器模型Container Model 78 布局 Layouts 80 Grid 82 XTemplate 83 DataView 84 其它新组件 84 EXT2简介 85 下载Ext 85 开始! 85 Element:Ext的...

    extjs学习笔记

    在使用Ext开发的应用程序中,组件Component是最高层次的抽象,是直接给用户使用的,Ext Element是Ext的底层API,主要是由Ext或自定义组件调用的,而DOM是W3C标准定义的原始API,Ext的Element通过操作DOM 来实现页面...

    misbehave:将Polymer v1组件转变为行为

    行为不端将Polymer v1组件转变为行为用法错误行为向所有Polymer组件添加了一个方法element.toBehavior() ,该方法导出了行为定义,该行为... Polymer ( { is : 'ext-component' , // ext-component now effectively ext

    JavaSE-6.0-英文手册(2008/11/30_FullUpdate)

    javax.lang.model.element javax.lang.model.type javax.lang.model.util javax.management javax.management.loading javax.management.modelmbean javax.management.monitor javax.management.openmbean ...

    用Vue.extend构建消息提示组件的方法实例

    按照官方文档说法,他是一个类构造器,用来创建一个子类vue并返回构造函数,而Vue.component它的任务是将给定的构造函数与字符串ID相关联,以便Vue.js可以在模板中接收它。 了解了这点之后我们开始做我们的消息提示...

    CodeTyphonIns2.30

    -ADD pl_Graphics32EXT, Extensions for Graphics32 (Win32, Win64, Linux32, Linux64, WinCE) -ADD pl_Cindy (Win32, Win64, Linux32, Linux64, WinCE) -ADD pl_BGRAueControls (Win32, Win64, Linux32, Linux...

Global site tag (gtag.js) - Google Analytics