Extjs 基础篇—— Ext.DomHelper

Ext.DomHelper是处理DOM或模板（Templates）的实用类。其实就是对原生的DOM操作进行封装、改进，让我们更加方便的操作DOM元素。
Ext.DomHelper的主要方法如下：
1.append( String/HTMLElement/Element el, Object/String o, Boolean returnElement )
2.insertHtml( String where, HTMLElement el, String html )
3.overwrite( String/HTMLElement/Element el, Object/String o, Boolean returnElement )
4.createTemplate( Object o )
例子：
1.

function appendAsTag(){
    var str = '<ul><li>巴以冲突持续升级,</li>';
    str += '<li>中共十八大报道,</li>';
    str += '<li>成品油价格下调,</li><ul>';
    Ext.DomHelper.append('myDiv',str);
 }

function appendAsObj(){
    var obj = {
        tag : 'ul',
        children:[
             {tag:'li',html:'巴以冲突持续升级'},
             {tag:'li',html:'中共十八大报道'},
             {tag:'li',html:'成品油价格下调'}
         ]
    };
    Ext.DomHelper.append('myDiv',obj);
 }

function testInsert(){
     var str = '<ul><li>巴以冲突持续升级,</li>';
     str += '<li>中共十八大报道,</li>';
     str += '<li>成品油价格下调,</li><ul>';
     Ext.DomHelper.insertHtml('afterBegin',Ext.getDom('myDiv'),str);
   }

function testOverWrite(){
     var str = '<ul><li>巴以冲突持续升级,</li>';
     str += '<li>中共十八大报道,</li>';
     str += '<li>成品油价格下调,</li><ul>';
     Ext.DomHelper.overwrite('myDiv',str);
   }

function testTemplate(){
     var tpl = Ext.DomHelper.createTemplate("<li>{content}</li>");
     tpl.overwrite('myDiv',{content:'中共十八大报道'});
   }

作者:wangyuelucky
原文:http://wangyuelucky.blog.51cto.com/1011508/1064742