DomHelper-more.js
上传用户:shuoshiled
上传日期:2018-01-28
资源大小:10124k
文件大小:6k
源码类别:

中间件编程

开发平台:

JavaScript

  1. /*!  * Ext JS Library 3.0.0  * Copyright(c) 2006-2009 Ext JS, LLC  * licensing@extjs.com  * http://www.extjs.com/license  */ /**
  2.  * @class Ext.DomHelper
  3.  */
  4. Ext.apply(Ext.DomHelper,
  5. function(){
  6. var pub,
  7. afterbegin = 'afterbegin',
  8.      afterend = 'afterend',
  9.      beforebegin = 'beforebegin',
  10.      beforeend = 'beforeend';
  11. // private
  12.     function doInsert(el, o, returnElement, pos, sibling, append){
  13.         el = Ext.getDom(el);
  14.         var newNode;
  15.         if (pub.useDom) {
  16.             newNode = createDom(o, null);
  17.             if (append) {
  18.             el.appendChild(newNode);
  19.             } else {
  20.          (sibling == 'firstChild' ? el : el.parentNode).insertBefore(newNode, el[sibling] || el);
  21.             }
  22.         } else {
  23.             newNode = Ext.DomHelper.insertHtml(pos, el, Ext.DomHelper.createHtml(o));
  24.         }
  25.         return returnElement ? Ext.get(newNode, true) : newNode;
  26.     }
  27. // build as dom
  28.     /** @ignore */
  29.     function createDom(o, parentNode){
  30.         var el,
  31.          doc = document,
  32.          useSet,
  33.          attr,
  34.          val,
  35.          cn;
  36.         if (Ext.isArray(o)) {                       // Allow Arrays of siblings to be inserted
  37.             el = doc.createDocumentFragment(); // in one shot using a DocumentFragment
  38.         Ext.each(o, function(v) {
  39.                 createDom(v, el);
  40.             });
  41.         } else if (Ext.isString(o)) {         // Allow a string as a child spec.
  42.             el = doc.createTextNode(o);
  43.         } else {
  44.             el = doc.createElement( o.tag || 'div' );
  45.             useSet = !!el.setAttribute; // In IE some elements don't have setAttribute
  46.             Ext.iterate(o, function(attr, val){
  47.                 if(!/tag|children|cn|html|style/.test(attr)){
  48.                 if(attr == 'cls'){
  49.                     el.className = val;
  50.                 }else{
  51.                         if(useSet){
  52.                             el.setAttribute(attr, val);
  53.                         }else{
  54.                             el[attr] = val;
  55.                         }
  56.                 }
  57.                 }
  58.             });
  59.             pub.applyStyles(el, o.style);
  60.             if ((cn = o.children || o.cn)) {
  61.                 createDom(cn, el);
  62.             } else if (o.html) {
  63.                 el.innerHTML = o.html;
  64.             }
  65.         }
  66.         if(parentNode){
  67.            parentNode.appendChild(el);
  68.         }
  69.         return el;
  70.     }
  71. pub = {
  72. /**
  73.      * Creates a new Ext.Template from the DOM object spec.
  74.      * @param {Object} o The DOM object spec (and children)
  75.      * @return {Ext.Template} The new template
  76.      */
  77.     createTemplate : function(o){
  78.         var html = Ext.DomHelper.createHtml(o);
  79.         return new Ext.Template(html);
  80.     },
  81. /** True to force the use of DOM instead of html fragments @type Boolean */
  82.     useDom : false,
  83.     /**
  84.      * Applies a style specification to an element.
  85.      * @param {String/HTMLElement} el The element to apply styles to
  86.      * @param {String/Object/Function} styles A style specification string e.g. 'width:100px', or object in the form {width:'100px'}, or
  87.      * a function which returns such a specification.
  88.      */
  89.     applyStyles : function(el, styles){
  90.     if(styles){
  91. var i = 0,
  92.      len,
  93.      style;
  94.      el = Ext.fly(el);
  95. if(Ext.isFunction(styles)){
  96.     styles = styles.call();
  97. }
  98. if(Ext.isString(styles)){
  99. styles = styles.trim().split(/s*(?::|;)s*/);
  100. for(len = styles.length; i < len;){
  101. el.setStyle(styles[i++], styles[i++]);
  102. }
  103. }else if (Ext.isObject(styles)){
  104. el.setStyle(styles);
  105. }
  106. }
  107.     },
  108.     /**
  109.      * Creates new DOM element(s) and inserts them before el.
  110.      * @param {Mixed} el The context element
  111.      * @param {Object/String} o The DOM object spec (and children) or raw HTML blob
  112.      * @param {Boolean} returnElement (optional) true to return a Ext.Element
  113.      * @return {HTMLElement/Ext.Element} The new node
  114.          * @hide (repeat)
  115.      */
  116.     insertBefore : function(el, o, returnElement){
  117.         return doInsert(el, o, returnElement, beforebegin);
  118.     },
  119.     /**
  120.      * Creates new DOM element(s) and inserts them after el.
  121.      * @param {Mixed} el The context element
  122.      * @param {Object} o The DOM object spec (and children)
  123.      * @param {Boolean} returnElement (optional) true to return a Ext.Element
  124.      * @return {HTMLElement/Ext.Element} The new node
  125.          * @hide (repeat)
  126.      */
  127.     insertAfter : function(el, o, returnElement){
  128.         return doInsert(el, o, returnElement, afterend, 'nextSibling');
  129.     },
  130.     /**
  131.      * Creates new DOM element(s) and inserts them as the first child of el.
  132.      * @param {Mixed} el The context element
  133.      * @param {Object/String} o The DOM object spec (and children) or raw HTML blob
  134.      * @param {Boolean} returnElement (optional) true to return a Ext.Element
  135.      * @return {HTMLElement/Ext.Element} The new node
  136.          * @hide (repeat)
  137.      */
  138.     insertFirst : function(el, o, returnElement){
  139.         return doInsert(el, o, returnElement, afterbegin, 'firstChild');
  140.     },
  141.     /**
  142.      * Creates new DOM element(s) and appends them to el.
  143.      * @param {Mixed} el The context element
  144.      * @param {Object/String} o The DOM object spec (and children) or raw HTML blob
  145.      * @param {Boolean} returnElement (optional) true to return a Ext.Element
  146.      * @return {HTMLElement/Ext.Element} The new node
  147.          * @hide (repeat)
  148.      */
  149.     append: function(el, o, returnElement){
  150.             return doInsert(el, o, returnElement, beforeend, '', true);
  151.         },
  152.     /**
  153.      * Creates new DOM element(s) without inserting them to the document.
  154.      * @param {Object/String} o The DOM object spec (and children) or raw HTML blob
  155.      * @return {HTMLElement} The new uninserted node
  156.      */
  157.         createDom: createDom
  158. };
  159. return pub;
  160. }());