Ext.DomQuery类
selector语法详见Ext类
compile( String selector, [String type] ) : Function
编写一个选择器或xpath查询到一个方法以方便重用,type取select(默认)或simple值之一
filter( Array el, String selector, Boolean nonMatches ) : Array
过滤el中的元素,保留符合selector的,如果nonMatches为真,结果相反
is( String/HTMLElement/Array el, String selector ) : Boolean
验证el是否匹配selector
select( String selector, [Node root] ) : Array
从root中选择匹配selector的对象数组
selectNode( String selector, [Node root] ) : Element
返回root中第一个匹配selector的对象
selectNumber( String selector, [Node root], Number defaultValue ) : Number
返回root中第一个匹配selector的对象的节点值,转换为整数或浮点数
selectValue( String selector, [Node root], String defaultValue ) : void
返回root中第一个匹配selector的对象的节点值,如果为null,用默认值defaultValue代替
Ext.DomHelper类
append( Mixed el, Object/String o, [Boolean returnElement] ) : HTMLElement/Ext.Element
创建一个新的DOM元素并添加到el
参数 o 是一个DOM对象或一个原始html块
applyStyles( String/HTMLElement el, String/Object/Function styles ) : void
应用样式styles到对象el, 样式的对象表示方法见Ext.Element
createTemplate( Object o ) : Ext.Template
由o创建一个新的Ext.Template对象,详见 Ext.Template
insertAfter( Mixed el, Object o, [Boolean returnElement] ) : HTMLElement/Ext.Element
insertBefore( Mixed el, Object/String o, [Boolean returnElement] ) : HTMLElement/Ext.Element
创建一个新的DOM对象o并将他们挺入在el之后/之前
insertFirst( Mixed el, Object/String o, [Boolean returnElement] ) :
创建一个新的DOM元素并做为第一个子节点添加到el (看了这个insertFirst,建议将append取一个别名insertLast:))
insertHtml( String where, HTMLElement el, String html ) : HTMLElement
where 可选值beforeBegin/afterBegin/beforeEnd/afterEnd
将html代码插入到el附近,
markup( Object o ) : String
返回DOM对象o对应的html代码
overwrite( Mixed el, Object/String o, [Boolean returnElement] ) :
创建一个新的DOM元素o并用它重写el的内容
Ext.Template类
Template类主要是功能是生产html片断,例
var t = new Ext.Template(
'<div name="{id}">',
'<span class="{cls}">{name:trim} {value:ellipsis(10)}</span>',
'</div>'
);
t.append('some-element', {id: 'myid', cls: 'myclass', name: 'foo', value: 'bar'});
公用方法:
Template( String/Array html )
构造一个Ext.Template对象,参数可以是字符串形式的html代码或它们组成的数组,
Template.from( String/HTMLElement el, Object config ) : Ext.Template
能过el的value(优先)或innerHTML来构造模板
append( Mixed el, Object values, [Boolean returnElement] ) : HTMLElement/Ext.Element
insertAfter( Mixed el, Object values, [Boolean returnElement] ) : HTMLElement/Ext.Element
insertBefore( Mixed el, Object values, [Boolean returnElement] ) : HTMLElement/Ext.Element
insertFirst( Mixed el, Object values, [Boolean returnElement] ) : HTMLElement/Ext.Element
这组方法提供由 value产生的html 代码,并添加到dom 做为el的最后一个子节点/下一个兄弟节点/前一个兄弟节点/第一个子节点
values解释参见applyTemplate
apply() : void
applyTemplate( Object values ) : String
apply是applyTemplate的简写,如果参数是数字values可以是一个数组,或者一个象 {id: 'myid', cls: 'myclass', name: 'foo', value: 'bar'}这样的json对象
compile() : Ext.Template
编译模板,替换掉模板中的\=>\\ ,\r\n|\n==>\\n, '=\',主要是为了js自己处理方便
overwrite( Mixed el, Object values, [Boolean returnElement] ) :
利用values生成html替换el的内容
set( String html, [Boolean compile] ) : Ext.Template
设置模板的html,如果compile为真将调用compile方法
分享到:
相关推荐
7、Ext.Element类 ………………………… 7 8、Ext.DomQuery类 ………………… 13 9、Ext.DomHelper类 …………………… 14 10、Ext.Template类 …………………… 14 11、Ext.EventManager类 ……………… 15 12、Ext...
`EXT核心API详解(四)-Ext.DomQuery DomHelper Template.txt`涵盖了查询DOM元素的`Ext.DomQuery`(类似于jQuery的selector),动态创建和操作DOM的`DomHelper`,以及用于数据绑定的`Template`类。这些工具使你能更加...
EXT 核心 API 详解(四) - Ext.DomQuery/DomHelper/Template EXT JS 是一个专注于构建前端用户界面的JavaScript框架,它独立于后台技术,主要利用Ajax技术实现丰富的交互效果。本文将深入探讨EXT JS的核心API,特别...
7、Ext.Element类 ………………………… 7 8、Ext.DomQuery类 ………………… 13 9、Ext.DomHelper类 …………………… 14 10、Ext.Template类 …………………… 14 11、Ext.EventManager类 ……………… 15 12、Ext...
- `Ext.DomQuery.selectNode(selector, context)`:选择符合指定CSS选择器的第一个元素。 #### 九、Ext.DomHelper类(第14页) - **概述**:Ext.DomHelper类提供了一组用于创建、插入和更新DOM节点的方法。 - **...
6.1 ext js的选择器:ext.domquery / 215 6.1.1 选择器的作用 / 215 6.1.2 使用ext.query选择页面元素 / 215 6.1.3 基本选择符 / 223 6.1.4 属性选择符 / 229 6.1.5 css属性值选择符 / 234 6.1.6 伪类选择符 ...
8. **Ext.DomQuery类**:快速高效的DOM选择器引擎,类似于jQuery的选择器功能。 9. **Ext.DomHelper类**:用于创建和修改DOM元素的工具类,提供了更简洁的API。 10. **Ext.Template类**:模板类,可以用来生成动态...
Ext.DomQuery允许开发者使用类似CSS选择器的语言来查询DOM元素,而DomHelper提供了一系列工具方法来创建、插入、更新和删除DOM元素。Template则是一种用于动态生成HTML的模板引擎,它支持数据绑定,使得动态内容的...
- `Ext.DomQuery.selectNode(node, selector)`: 在指定节点下选择符合指定条件的DOM元素。 - `Ext.DomQuery.selectNodes(node, selector)`: 选择多个符合条件的DOM元素。 #### 9. Ext.DomHelper 类 (P.14) - **...
5. **EXT核心API详解(三)-Ext.DomQuery DomHelper Template**:这部分主要涉及DOM查询、DOM辅助器和模板。`Ext.DomQuery`(简称`$`)类似于jQuery的`select`,用于高效地选取DOM节点,支持XPath和CSS选择器。`Ext....
"EXT核心API详解(四)-Ext.DomQuery DomHelper Template.txt"介绍了Ext.DomQuery,这是一个强大的CSS选择器引擎,类似于jQuery的选择器,用于高效地选取DOM元素。DomHelper则是一个便捷的DOM元素构建工具,可以生成...
"EXT核心API详解(四)-Ext.DomQuery DomHelper Template.txt"介绍了Ext.DomQuery,这是一个高效的DOM选择器引擎,类似于jQuery的$.selector。DomHelper则是用于创建和操作DOM结构的工具,而Template则是用于动态生成...
通过这种方式,ExtJS确保了像`Ext.DomHelper`和`Ext.DomQuery`这样的工具类在整个应用中只被初始化一次,从而提高了性能并减少了内存消耗。 #### 四、单例模式的优点 - **唯一性**:确保在整个应用中只有一个实例...
var els = Ext.DomQuery.select('.some-class'); ``` ##### 5. Ext.Fx - **动画效果**: `Ext.Fx`提供了一系列的动画效果,可以用来增强用户界面的交互体验。 - **方法示例**: 如`Ext.Fx.run()`可以运行一组动画...
4. `Ext.DomQuery`: 用于高效地选择DOM元素的工具,类似于jQuery的`$`。 - `matchers`, `pseudos`: 匹配规则和伪类选择器。 - `compile()`: 编译查询表达式。 - `filter()`: 过滤元素集合。 - `is()`: 检查元素...
`Ext.DomQuery`:提供类似于jQuery的选择器功能,如编译CSS选择器,过滤元素,检查元素是否匹配选择器,以及选择和选择单个节点。 24-27. `Ext.util.CSS`:CSS操作工具,包括创建样式表,获取CSS规则,交换样式表...
8. **Ext.DomQuery 类**:类似于jQuery的选择器,用于高效地选择DOM元素。 9. **Ext.DomHelper 类**:用于动态创建和修改DOM元素,提供了一种模板化的创建方式。 10. **Ext.Template 类**:模板引擎,用于动态生成...
在“EXT核心API详解(四)-Ext.DomQuery DomHelper Template.txt”中,你可以学习到如何使用这些工具来提升DOM操作的效率。 5. **Ext.Fx**:这是ExtJS的动画模块,提供了多种动画效果,如淡入淡出、移动、缩放等。在...