Ext.元素模板(DomHelper)

weixin_34106122

于 2011-08-28 21:38:00 发布

阅读量50

点赞数

CC 4.0 BY-SA版权

原文链接：https://my.oschina.net/wjgood/blog/30452

本文介绍了 Ext DomHelper 的使用方法，包括 append、insertBefore、insertAfter 和 overwrite 等方法来创建和操作 DOM 元素，并展示了如何设置元素样式。

//return 返回新创建的元素
	  	var h1 = Ext.DomHelper.append("target",{tag:'h1',cls : 'blue',html:"1246"});
	  	var p = Ext.DomHelper.insertBefore("target",{tag:"p",cls: "yellow",html:"Ext.dh.insertBefore"});
	  	var p2 = Ext.DomHelper.insertAfter("target",{id:"oo",tag:"p",cls: "red",html:"Ext.dh.insertAfter"});
	  	var p3 = Ext.DomHelper.overwrite("target",{id:"myttt",tag:"p",cls: "yellow",html:"Ext.dh.overwrite"});
	  	
	  	var p4 = Ext.DomHelper.append("target",
	  	{tag:"ul",
	  	style:'color:white',
	  	children:[
	  		{tag:'li',html:"1"},
	  		{tag:'li',html:"2"},
	  		{tag:'li',html:"3"}
	  	]});
	  	/*
			target 是 Mixed el
			tag 是创建的元素名,如 div,p
            cls 元素样式
            html 元素之内的内容
		*/
		//为给定el set style		
		Ext.DomHelper.applyStyles("target",{background:'green'});
		/** 或
			Ext.DomHelper.applyStyles("target",function(){
				return 'background-color:yellow';
			});
		*/

转载于:https://my.oschina.net/wjgood/blog/30452