`

Ext Template Domhelper使用

阅读更多
引用

var menuEditTemplate = new Ext.Template(   
            '<a href="#"><img border="0" src="{imgsrc}"></a>'  
        );         
        menuEditTemplate.compile();   
var result = menuEditTemplate.apply(   
                    {imgsrc:'resources/images/icon/16/application_form_edit.png'}   
            );   
  

var dh=Ext.DomHelper;              
// create the node   
var list = dh.append('my-div', {tag: 'ul', cls: 'my-list'});   
// get template   
var tpl = dh.createTemplate({tag: 'li', id: 'item{0}', html: 'List Item {0}'});   
for(var i = 0; i < 5, i++){       
     tpl.append(list, [i]);    
// use template to append to the actual node   
   }  

<div id="blog-roll"></div>
	<script type="text/javascript">
	//例子一:
	<!--	
		var html = '<a id="{id}" href="{url}" class="nav">{text}</a>';
		var tpl = new Ext.DomHelper.createTemplate(html);
		tpl.append('blog-roll',{
								id: 'link1',
								url: 'http://z-jianwen.iteye.com/admin/blogs/765729',
								text: "Jack's Site"}
								);
		tpl.append('blog-roll', {
								id: 'link2',
								url: 'http://www.dustindiaz.com/',
								text: "Dustin's Site"}
								);
	-->	

分享到:
评论

相关推荐

    EXT核心API详解

    9、Ext.DomHelper类 …………………… 14 10、Ext.Template类 …………………… 14 11、Ext.EventManager类 ……………… 15 12、Ext.EventObject类 ………………… 15 13、Ext.CompositeElement类 ………… 16 14、...

    Ext 开发指南 学习资料

    8.3. DomHelper和Template动态生成html 8.3.1. DomHelper用来生成小片段 8.3.2. 批量生成还是需要Template模板 8.3.3. 醍醐灌顶,功能强劲的模板引擎XTemplate。 8.4. Ext.data命名空间 8.4.1. proxy系列 8.4.1.1. ...

    EXT2.0中文教程

    8.3. DomHelper和Template动态生成html 8.3.1. DomHelper用来生成小片段 8.3.2. 批量生成还是需要Template模板 8.4. Ext.data命名空间 8.4.1. proxy系列 8.4.1.1. 人畜无害的MemoryProxy 8.4.1.2. 常规武器HttpProxy...

    EXT教程EXT用大量的实例演示Ext实例

    8.3. DomHelper和Template动态生成html 8.3.1. DomHelper用来生成小片段 8.3.2. 批量生成还是需要Template模板 8.4. Ext.data命名空间 8.4.1. proxy系列 8.4.1.1. 人畜无害的MemoryProxy 8.4.1.2. 常规武器...

    Ext深入浅出 数据传输

    11.9 使用Ext.util.CSS管理CSS样式..... 290 11.10 使用Ext.util.ClickRepeater 处理点击事件...................................... 291 11.11 使用Ext.util.DelayedTask 延时执行函数..............................

    ExtJS入门教程(超级详细)

    9、Ext.DomHelper类 …………………… 14 10、Ext.Template类 …………………… 14 11、Ext.EventManager类 ……………… 15 12、Ext.EventObject类 ………………… 15 13、Ext.CompositeElement类 ………… 16 14、...

    掏钱学Ext(完整版) 附全部源码

    3.6. 下一步使用jsp作为后台,让咱们看看实际怎么用程序判断,来返回特定节点的子节点。 4. 祝福吧!把表单和输入控件都改成ext的样式。 4.1. 不用ext的form啊,不怕错过有趣的东西吗? 4.2. 慢慢来,先建一个...

    精通JS脚本之ExtJS框架.part1.rar

    6.5.1 Ext.Template 6.5.2 Ext.XTemplate 第7章 设计表单类布局 7.1 Form表单简介 7.1.1 Form表单的基本配置 7.1.2 ExtJS对Form表单的封装 7.2 ExtJS的表单组件 7.2.1 文本输入控件Ext.form.TextField 7.2.2...

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

    6.3.2 Ext.core.DomHelper.applyStyles() 6.3.3 createTemplate() 6.3.4 insertAfter() 6.3.5 insertBefore() 6.3.6 insertFirst() 6.3.7 insertHtml() 6.3.8 overwrite() 6.4 Ext.core....

    精通JS脚本之ExtJS框架.part2.rar

    6.5.1 Ext.Template 6.5.2 Ext.XTemplate 第7章 设计表单类布局 7.1 Form表单简介 7.1.1 Form表单的基本配置 7.1.2 ExtJS对Form表单的封装 7.2 ExtJS的表单组件 7.2.1 文本输入控件Ext.form.TextField 7.2.2...

Global site tag (gtag.js) - Google Analytics