当前位置: 代码迷 >> Web前端 >> [转载]EXT核心API详解(4)Ext.DomQuery/DomHelper/Template类
  详细解决方案

[转载]EXT核心API详解(4)Ext.DomQuery/DomHelper/Template类

热度:391   发布时间:2012-10-31 14:37:32.0
[转载]EXT核心API详解(四)Ext.DomQuery/DomHelper/Template类
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方法
  相关解决方案