ExtJS Learning----------Ext.domhelper class Learning (example)

Specific instances (instance results in the program)

Ext.onready (function () {//Prep ext.create (' Ext.panel.Panel ', {title: ' domhelper-element Builder use ', Width: ' 90% ', height:400, RenderTo:Ext.getBody (), HTML: ' <div id=d1> I Am d1</div> '});//domhelper//1:createhtml or Markup method//Configuration Item Description: four/ The name of the/tag element//CHILDREN/CN represents the child element//cls represents the style//html: text content//var HTML = Ext.DomHelper.createHtml ({//tag: ' ol ',//cn:[//{tag: ' Li ', HTML: ' item1 '},//{tag: ' li ', HTML: ' item2 '}//]//}),//console.info (HTML);//Print results to console//return results: You can view the console, the value of HTML is: <ol><li>item1</li><li>item2</li></ol>//can set the various attributes in the tag itself, resulting in a traditional html//var html = Ext.DomHelper.createHtml ({//tag: ' div ',//children:[//{tag: ' A ', HTML: ' BJSXT website ', href: ' www.bjsxt.cn '},//{tag: ' Input ', Value: ' Click ', type: ' button '}//]//});//console.info (HTML);//2:createdom method (This method is to generate native DOM nodes, not recommended)//var dom = Ext.DomHelper.createDom ({//tag: ' div ',//html: ' I am div '//});//console.info (DOM);//alert (dom.nodename);//3:append method Ext.DomHelper.append (' D1 ', {//tag: ' ul ',//cn:[{tag: ' Li ', HTML: ' 1111 '},{tag: ' li ', HTML: ' 2222 '}]//});//ext.domhelper.append (' D1 ', ' <span> i is span content </span> '),//4:inserthtml method//This method is to operate the native node nodes// Parameter description: String where, Htmlelement/textnode el, String html//ext.domhelper.inserthtml (' Beforebegin ', ext.getdom (' D1 '), ' 

ExtJS Learning----------Ext.domhelper class Learning (example)