HTML5 developing mobile Web Apps--sencha Touch (7)

<span id="Label3"></p><p><p>The Ext.domhelper component in Sencha touch <span style="font-family:宋体">makes it easy to append or rewrite Elements.</span></p></p><p><p>Example:</p></p><p><p></p></p><pre code_snippet_id="1574565" snippet_file_name="blog_20160204_1_4125999" name="code" class="javascript"><pre code_snippet_id="1574565" snippet_file_name="blog_20160204_1_4125999" name="code" class="javascript">Launch:function () {function appenddom () {Ext.DomHelper.append (' my-div ', {id: ' url-list ', tag: ' ul ', //specify appended element kind CN : [///or children, using array form to define child elements in the array {tag: ' Li ',, cn:[{tag: ' a ', html: ' Google ', href: ' http://www.google.com '}]},{tag: ' Li ', Cn:[{tag: ' a ',//... The following ellipsis}]})}); var Mytoolbar = ext.create (' ext.toolbar ', {docked: ' top ', items:[{xtype: ' button ', text: ' append element ', handler:function () { Appenddom ();}}]}); var mypanel = ext.create (' ext.panel ', {id: ' mypanel ', html: ' <div id= ' my-div ' ></div> ', items:[mytoolbar]}); Ext.Viewport.add (mypanel);}</pre></pre><br><br><p><p></p></p><p><p>In addition to <span style="font-family:Calibri">append</span><span style="font-family:宋体">, you can use</span> the <span style="font-family:Calibri">overwrite</span> <span style="font-family:宋体">function to rewrite the contents of an element, as</span> above</p></p><p><p>Appends and deletes elements at the specified location, with the following methods:</p></p><p><p>Innsertafter: <span style="font-family:宋体">appending elements after the target element</span></p></p><p><p>Innsertbefore: <span style="font-family:宋体">appending elements before the target element</span></p></p><p><p>Ext.domquery: <span style="font-family:宋体">look for elements that can be selected using</span> the <span style="font-family:Calibri">CSS</span> <span style="font-family:宋体">selector, such as:</span></p></p><p><p>Ext.DomQuery.select (' [class*= ' d '] ')// <span style="font-family:宋体">Select</span> <span style="font-family:宋体">the element with</span> <span style="font-family:Calibri">class</span> <span style="font-family:宋体"></span> <span style="font-family:Calibri">d</span></p></p><p><p>Ext.each: <span style="font-family:宋体">Traversal of all appended elements</span></p></p><p><p>Ext.removenode: <span style="font-family:宋体">Deleting the specified element</span></p></p><p><p>Example:</p></p><p><p>var elems = Ext.DomQuery.select ('. Add ');</p></p><p><p>Ext.each (elems,function (item,index,array) {//function <span style="font-family:宋体">parameter: Current processing element, current processing element subscript, processing set;</span><span style="font-family:Calibri">elems</span> <span style="font-family:宋体"> For the collection to be processed</span></p></p><p><p>Ext.removenode (item);</p></p><p><p>})</p></p><p><p>The meaning of the above code is: Delete all appended <span style="font-family:Calibri">class</span> <span style="font-family:宋体">name</span> <span style="font-family:Calibri">add</span> <span style="font-family:宋体">element</span></p></p><p><p></p></p><p><p>HTML5 developing mobile Web Apps--sencha Touch (7)</p></p></span>