Ext JS学习第十四天 Ext基础之 Ext.DomHelper
此文用来记录学习笔记
Ext.onReady(function () { //准备工作
Ext.create('Ext.panel.Panel', {
title: 'DomHelper-元素生成器的使用',
width: '90%',
height: 400,
renderTo: Ext.getBody(),
html: '<div id=d1>我是d1</div>'
}); //DomHelper
//1: createHtml或markup方法
//配置项说明:
//tag 元素的名称
//children/cn表示子元素
//cls表示样式
//html:文本内容
var html = Ext.DomHelper.createHtml({
tag:'ol' ,
cn:[
{tag:'li',html:'item1'},
{tag:'li',html:'item2'}
]
});
console.info(html); var html = Ext.DomHelper.createHtml({
tag:'div' ,
children:[
{tag:'a' ,html:'bjsxt网站' , href:'www.bjsxt.cn'},
{tag:'input' , value:'点击' , type:'button' }
]
});
console.info(html); //2: createDom方法 (这个方法是生成原生的dom节点,不推荐使用)
var dom = Ext.DomHelper.createDom({
tag:'div' ,
html:'我是div'
});
console.info(dom);
alert(dom.nodeName); //3: append方法
Ext.DomHelper.append('d1',{
tag:'ul' ,
cn:[{tag:'li',html:'1111'},{tag:'li',html:'2222'}]
});
Ext.DomHelper.append('d1','<span>我是span内容</span>'); //4:insertHtml方法 //这个方法就是为了操作原生的node节点的
//参数说明:String where, HTMLElement/TextNode el, String html
Ext.DomHelper.insertHtml('beforeBegin',Ext.getDom('d1'),'<h1>我是标题!!</h1>') //5:overwrite方法
Ext.DomHelper.overwrite('d1',{tag:'span',html:'我是覆盖的span'});
Ext.DomHelper.overwrite('d1','aaaaa'); //6:createTemplate方法
var tp = Ext.DomHelper.createTemplate('<h1>{text}</h1><h2>{text2}</h2>'); //return Ext.Template
tp.overwrite('d1',{text:'我是被替换的内容!!',text2:'我也是替换的内容!!'}); //7:applyStyles方法
Ext.DomHelper.applyStyles('d1',{
width:'100px',
height:'100px',
backgroundColor:'green'
}); });
给各位推荐个文章网www.fishcmonkey.com,学习之余提高文学修养;
Ext JS学习第十四天 Ext基础之 Ext.DomHelper的更多相关文章
- Ext JS学习第十六天 事件机制event(一) DotNet进阶系列(持续更新) 第一节:.Net版基于WebSocket的聊天室样例 第十五节:深入理解async和await的作用及各种适用场景和用法 第十五节:深入理解async和await的作用及各种适用场景和用法 前端自动化准备和详细配置(NVM、NPM/CNPM、NodeJs、NRM、WebPack、Gulp/Grunt、G
code&monkey Ext JS学习第十六天 事件机制event(一) 此文用来记录学习笔记: 休息了好几天,从今天开始继续保持更新,鞭策自己学习 今天我们来说一说什么是事件,对于事件 ...
- Ext JS学习第十天 Ext基础之动态加载JS文件(补充)
此文用来记录学习笔记: •Ext4.x版本提供的一大亮点就是Ext.Loader这个类的动态加载机制!只要遵循路径规范,即可动态加载js文件,方便把自己扩展组件动态加载进来,并且减轻浏览器的压力. • ...
- Ext JS学习第十五天 Ext基础之 Ext.DomQuery
此文同来记录学习笔记 •Ext.dom.Query 嗯,这个类一看就是到时做什么事儿的,不用我去过多的解释了.这个类一共提供了8个方法供开发人员去使用. •要说最常用的方法,无非就是Ext.query ...
- Ext JS学习第十天 Ext基础之 扩展原生的javascript对象(二)
此文来记录学习笔记: 今天继续说Ext.Array,Ext.Function,Ext.Date,Ext.Error ------------------------------------------ ...
- Ext JS学习第十六天 事件机制event(一)
此文用来记录学习笔记: 休息了好几天,从今天开始继续保持更新,鞭策自己学习 今天我们来说一说什么是事件,对于事件,相信你一定不陌生, 基本事件是什么?就类似于click.keypress.focus. ...
- 介绍Ext JS 4.2的新特性的《深入浅出Ext JS》上市
以用户为中心的时代,应用的界面外观变得越来越重要.然而,很多程序员都缺乏美术功底,要开发出界面美观的应用实属不易.Ext JS的出现,为广大程序员解决了这一难题.它有丰富多彩的界面和强大的功能,是开发 ...
- python3.4学习笔记(十四) 网络爬虫实例代码,抓取新浪爱彩双色球开奖数据实例
python3.4学习笔记(十四) 网络爬虫实例代码,抓取新浪爱彩双色球开奖数据实例 新浪爱彩双色球开奖数据URL:http://zst.aicai.com/ssq/openInfo/ 最终输出结果格 ...
- Linux学习之十四、管线命令
Linux学习之十四.管线命令 地址:http://vbird.dic.ksu.edu.tw/linux_basic/0320bash_6.php
- 风炫安全WEB安全学习第二十四节课 利用XSS钓鱼攻击
风炫安全WEB安全学习第二十四节课 利用XSS钓鱼攻击 XSS钓鱼攻击 HTTP Basic Authentication认证 大家在登录网站的时候,大部分时候是通过一个表单提交登录信息. 但是有时候 ...
随机推荐
- 有意思,搞了这么多年WEB,还是第一次知道这个东西 关键字 前端模板
有意思,搞了这么多年WEB,还是第一次知道这个东西 关键字 前端模板 jquery-tmpl handlebars 项目中用的是handlebars jqtmpl配置不成功 不做记载 百度吧 小媳妇 ...
- PHP判断是中文还是英文
static function ischinese($s){ $allen = preg_match("/^[^/x80-/xff]+$/", $s); //判断是否是英文 $al ...
- lock table
1.在执行lock table语句后,则在执行unlock tables之前,当前会话只能操作当前被锁定的表(包括表别名)2.read锁,其它会话只有读取权限,没有写入权限3.write锁,其它会话只 ...
- jquery.cookie用法详细解析,封装的操作cookie的库有jquery.cookie.js
jquery.cookie用法详细解析 需要注意存入cookie前,对数据进行序列化, 得到后在反序列化: 熟练运用:JSON.stringify();和JSON.parse(): 通常分为如下几个步 ...
- cc150:实现一个算法来删除单链表中间的一个结点,仅仅给出指向那个结点的指针
实现一个算法来删除单链表中间的一个结点,仅仅给出指向那个结点的指针. 样例: 输入:指向链表a->b->c->d->e中结点c的指针 结果:不须要返回什么,得到一个新链表:a- ...
- OpenCV---图片生成视频
/** It is a batch processing interface. */ #include "stdafx.h" #include <windows.h> ...
- Node.js笔记1
Node.js入门笔记 1. node -help 可以显示帮助信息2. node REPL 模式(Read-eval-print loop) 输入—求值—输出循环 直接在cmd输入node 可以进入 ...
- C++中++运算符的重载
void showTime() const; Clock& operator ++(); Clock operator ++(int); private: int hour,minute,se ...
- app微信支付服务器端php demo
class Wxpay { /* 配置参数 */ private $config = array( 'appid' => "wxc92b12277f277355", /*微信 ...
- codeforces 557D. Vitaly and Cycle 二分图染色
题目链接 n个点, m条边, 问最少加几条边可以出现一个奇环, 在这种情况下, 有多少种加边的方式. 具体看代码解释 #include<bits/stdc++.h> using names ...