2014-06-27 48 views
0

花费了大量资源来弄清楚如何优化extJs HTML代码。 我有一个标签和ExtJS的组合框简单抛出一个页面这:ExtJs HTML/DOM代码优化

<tr role="presentation" id="inputs[1].TypeId-inputRow" class="x-form-item-input-row"> 
    <td role="presentation" id="inputs[1].TypeId-labelCell" style="" valign="top" halign="left" width="88" class="x-field-label-cell"> 
     <label 
     id="inputs[1].TypeId-labelEl" 
     for="inputs[1].TypeId-inputEl" 
     class="x-form-item-label x-unselectable x-form-item-label-left" 
     style="width:83px;margin-right:5px;" unselectable="on"> 

     Placement ID: 
    </label> 
    </td> 
    <td role="presentation" class="x-form-item-body x-form-trigger-wrap-focus" id="inputs[1].TypeId-bodyEl" colspan="2"> 
    <table id="inputs[1].TypeId-triggerWrap" class="x-form-trigger-wrap" cellpadding="0" cellspacing="0" style="table-layout: auto;"> 
     <tbody> 
     <tr> 
      <td id="inputs[1].TypeId-inputCell" class="x-form-trigger-input-cell"> 
        <div class="x-hide-display x-form-data-hidden" role="presentation" id="ext-gen1311"> 
      </div> 
      <input 
       id="inputs[1].TypeId-inputEl" 
       type="text" 
       class="x-form-field x-form-required-field x-form-text x-trigger-noedit x-form-focus x-field-form-focus x-field-default-form-focus" 
       autocomplete="off" 
          name="inputs[1].TypeId" 
       placeholder="DATA SOURCE" 
       readonly="readonly" 
       aria-invalid="false" 
       data-errorqtip="" 
       style="width: 137px;"> 
      </td> 
        <td valign="top" class=" x-trigger-cell x-unselectable" style="width:22px;" id="ext-gen1310"> 
      <div class="x-trigger-index-0 x-form-trigger x-form-arrow-trigger x-form-trigger-first" role="button" id="ext-gen1309"> 
      </div> 
      </td> 
     </tr> 
     </tbody> 
    </table> 
    </td> 
</tr> 

我应该如何改变表一表内只是简单的xtype:“组合框”? 我在页面上有上百个,因为非常沉重的HTML代码会减慢很多。

它可以用简单的div来完成,为什么extJS会呈现所有这些表代码?

+0

分机很漂亮,它从HTML中抽象出来。那么当你不需要用Ext中的HTML语言思考时,为什么你需要更改底层的HTML? – Saki

+0

,因为我不想在我的页面上使用多少HTML,因为它可以在几个div中完成 – antohoho

回答

0

如果你想/需要一个更简单的标记在Ext中,唯一的方法是编写你自己的组件,你可以定义一个更简单的组件。

没有办法简化Ext生成的标记,而没有破坏功能或布局引擎的危险。