`
wly719
  • 浏览: 290056 次
  • 性别: Icon_minigender_2
  • 来自: 杭州
社区版块
存档分类
最新评论

XTemplate的使用

阅读更多
var tpl = new Ext.XTemplate(
     '<tpl for=".">',
'<div id="{id}" style="margin-left:10px;margin-top:15px;"><img class="pt-service-test-icon" src="../images/s.gif"/>{name}:(<span class="pt-service-test-time"></span>)</div>',
'</tpl>'
);
上面这段的意思是:在页面上有一个DIV,其中包含一张图片,文字说明:(说明),
然后要根据判断改变图片的样式。
//得到返回对象
       var object = Ext.util.JSON.decode(response.responseText);
       var itemsO = object.items;
      var item,time,icon;
           for(var i = 0;i<itemsO.length;i++){
             item = Ext.get(itemsO[i].id);
             icon = item.child(".pt-service-test-icon");
             time = item.child(".pt-service-test-time");
             //改变图标
                  if(itemsO[i].res === 'true'){
             icon.addClass("pt-service-test-yes");
             }else if(itemsO[i].res === 'false'){
             icon.addClass("pt-service-test-no");
             }
             time.dom.innerHTML = itemsO[i].time;

//向一个div中加入另一个div

var res_el = Ext.get('testvalue');

var el = res_el.createChild({
tag:'div',
style:'padding-top:120px;margin-left:100px'
});
var btn = new Ext.Button({
text:'重新测试',
handler:function(){
test();
}
})
btn.render(el);
分享到:
评论

相关推荐

    xtemplate:xtemplate模板

    XTemplate 使用一套简洁的模板语言,允许开发者在模板中嵌入 JavaScript 表达式。例如: ```html &lt;div&gt;{name} ``` 这段模板会遍历 `items` 数组,并将每个元素的 `name` 属性值插入到 `div` 中。 ### 2. 控制...

    Node.js-Back2Front基于Express和XTemplate的模块化开发框架

    在Back2Front中,XTemplate被用于前端页面的视图层,它允许开发者使用简洁的语法结构将数据和逻辑与HTML分离,提高代码的可读性和复用性。XTemplate支持条件语句、循环结构、函数调用等,使得模板文件更易于理解和...

    extjsExtjs学习笔记——多个图片XTemplate排版居中,自动缩放处理

    在本文中,我们将深入探讨如何使用ExtJS的XTemplate来实现多张图片的居中排版和自动缩放处理。ExtJS是一个强大的JavaScript框架,它提供了丰富的组件和模板功能,帮助开发者构建用户界面。XTemplate是ExtJS中的一个...

    ext xtemplate 实例 利用模板 表格合并行 表格分组

    利用模板(xtemplate)表格合并行 简单实现表格分组,单元格行的合并。

    xtemplate node.js 的使用方法实例解析

    本文通过实例详细介绍了xtemplate在Node.js中的安装和使用方法。 在开始使用xtemplate之前,首先要确保已经安装了Node.js环境。接着,使用npm包管理器来安装xtemplate。在命令行中输入以下命令即可完成安装: ``` ...

    think-view-xtemplate:使用nunjucks渲染ThinkJS 3.x的视图文件

    think-view-xtemplate 使用nunjucks渲染ThinkJS 3.x的视图文件 安装 npm install think-view-xtemplate 如何使用 const xtpl = require ( 'think-view-xtpl' ) ; exports . view = { type : 'xtpl' , xtpl : { ...

    kissy-xtemplate:用于 KISSY 的独立 XTemplate 编译器

    亲吻xtemplate 用于 KISSY 的独立 XTemplate 编译器用法节点 var ...壳要使用 shell 版本,您最好使用-g安装它 npm install kissy-xtemplate -g然后,您可以使用xtemplate bin 进行编译。 xtemplate a.xtpl.html

    一个简单的Ext.XTemplate的实例代码

    总结一下,这个实例演示了如何使用Ext.XTemplate: 1. 发送Ajax请求获取JSON数据。 2. 解析JSON数据为JavaScript对象。 3. 创建Ext.XTemplate实例,定义数据和HTML结构的关系。 4. 编译模板以优化性能。 5. 将模板...

    xtpl2:xtpl 和 xtemplate 的捆绑模块

    如果我们想使用xtpl ,我们还需要在 package.json 上安装独立的xtemplate 。 xtpl2只是将两个模块包装在一个包中。 特点 2 以另一种方式支持koa ,比如 var app = koa(); app.context.render = require('xtpl2')....

    task-xtemplate:KISSY XTemplate 编译器

    使用示例 var xtemplate = new ( require ( 'task-xtemplate' ) ) xtemplate . run ( inputs , options , logger ) 选项 选项.version 类型: string 您的 KISSY 版本,默认为最新版本。 发布历史 2014-11-11 ...

    xtemplate:用于节点和浏览器的可扩展模板引擎库

    模板浏览器和nodejs上的高速,可扩展模板引擎库。...安装资源() 在浏览器上使用支持requirejs modulex kissy kissy画廊中文教程演示 在节点上使用请使用xtpl 贡献贡献 执照xtemplate是根据MIT许可发布的。

    XTemplate:一个用于管理HTML片段模板的简单Javascript库

    2015-09-12:V 1.5 在设置新语言时启用了自动翻译操作现在,翻译文件以异步模式加载(比不推荐使用的同步模式更好) 新增:现在,您可以简单地添加自己的占位符激活器添加了新方法register和unregister以管理自定义...

    LwIPv2.XTemplate(CMSISRTOS2)_Copy.7z

    标题中的"LwIPv2.XTemplate(CMSISRTOS2)_Copy.7z"是一个包含轻量级互联网协议(LWIP)版本2.x的模板项目,它基于CMSIS-RTOS2(ARM公司提供的实时操作系统服务接口标准)进行了适配。这个项目是针对安富莱(Altium ...

    Ext_3.2模板的使用示例

    本人觉得Ext.Template和Ext.XTemplate模板类非常类似.Net的母板页,或者非常类似于JSP技术中jstl标准标签和EL表达式功能;但是它是一个客户端的技术。 阅读目标:需要使用模板方式来开发web应用的人员。 前置条件:...

    XTemplate-开源

    **XTemplate 开源模板引擎详解** XTemplate 是一个基于 XML 的高效、易用的模板引擎,主要用于构建动态 Web 页面和应用程序。它允许开发者将数据和视图逻辑分离,通过简单的 XML 结构定义模板,然后结合数据进行...

    ExtJS模板使用说明(含代码示例).zip

    3. 使用XTemplate:XTemplate是ExtJS的一个高级模板引擎,提供更丰富的功能,如支持函数调用、条件语句等。 三、模板语法 模板语法主要基于两种类型的占位符: - `{}`:双大括号内的变量名代表数据对象的属性,例如...

    xtpl-emmet:sublime 的 xTemplate 代码片段

    xtpl emmet借助强大的 Emmet 插件,提供 xtemplate 中常用代码片段,从而提高开发效率。使用方法基于 Emmet 插件,以 Sublime text 为例:确保已经安装了 Emmet 插件,并且可以正常使用打开菜单 Preferences→...

Global site tag (gtag.js) - Google Analytics