docs/source/DomHelper-more.html

   1 <html>\r
   2 <head>\r
   3   <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />    \r
   4   <title>The source code</title>\r
   5     <link href="../resources/prettify/prettify.css" type="text/css" rel="stylesheet" />\r
   6     <script type="text/javascript" src="../resources/prettify/prettify.js"></script>\r
   7 </head>\r
   8 <body  onload="prettyPrint();">\r
   9     <pre class="prettyprint lang-js">/**\r
  10  * @class Ext.DomHelper\r
  11  */\r
  12 Ext.apply(Ext.DomHelper,\r
  13 function(){\r
  14         var pub,\r
  15                 afterbegin = 'afterbegin',\r
  16         afterend = 'afterend',\r
  17         beforebegin = 'beforebegin',\r
  18         beforeend = 'beforeend';\r
  19 \r
  20         // private\r
  21     function doInsert(el, o, returnElement, pos, sibling, append){\r
  22         el = Ext.getDom(el);\r
  23         var newNode;\r
  24         if (pub.useDom) {\r
  25             newNode = createDom(o, null);\r
  26             if (append) {\r
  27                     el.appendChild(newNode);\r
  28             } else {\r
  29                         (sibling == 'firstChild' ? el : el.parentNode).insertBefore(newNode, el[sibling] || el);\r
  30             }\r
  31         } else {\r
  32             newNode = Ext.DomHelper.insertHtml(pos, el, Ext.DomHelper.createHtml(o));\r
  33         }\r
  34         return returnElement ? Ext.get(newNode, true) : newNode;\r
  35     }\r
  36 \r
  37         // build as dom\r
  38     /** @ignore */\r
  39     function createDom(o, parentNode){\r
  40         var el,\r
  41                 doc = document,\r
  42                 useSet,\r
  43                 attr,\r
  44                 val,\r
  45                 cn;\r
  46 \r
  47         if (Ext.isArray(o)) {                       // Allow Arrays of siblings to be inserted\r
  48             el = doc.createDocumentFragment(); // in one shot using a DocumentFragment\r
  49                 Ext.each(o, function(v) {\r
  50                 createDom(v, el);\r
  51             });\r
  52         } else if (Ext.isString(o)) {         // Allow a string as a child spec.\r
  53             el = doc.createTextNode(o);\r
  54         } else {\r
  55             el = doc.createElement( o.tag || 'div' );\r
  56             useSet = !!el.setAttribute; // In IE some elements don't have setAttribute\r
  57             Ext.iterate(o, function(attr, val){\r
  58                 if(!/tag|children|cn|html|style/.test(attr)){\r
  59                         if(attr == 'cls'){\r
  60                             el.className = val;\r
  61                         }else{\r
  62                         if(useSet){\r
  63                             el.setAttribute(attr, val);\r
  64                         }else{\r
  65                             el[attr] = val;\r
  66                         }\r
  67                         }\r
  68                 }\r
  69             });\r
  70             Ext.DomHelper.applyStyles(el, o.style);\r
  71 \r
  72             if ((cn = o.children || o.cn)) {\r
  73                 createDom(cn, el);\r
  74             } else if (o.html) {\r
  75                 el.innerHTML = o.html;\r
  76             }\r
  77         }\r
  78         if(parentNode){\r
  79            parentNode.appendChild(el);\r
  80         }\r
  81         return el;\r
  82     }\r
  83 \r
  84         pub = {\r
  85                 <div id="method-Ext.DomHelper-createTemplate"></div>/**\r
  86              * Creates a new Ext.Template from the DOM object spec.\r
  87              * @param {Object} o The DOM object spec (and children)\r
  88              * @return {Ext.Template} The new template\r
  89              */\r
  90             createTemplate : function(o){\r
  91                 var html = Ext.DomHelper.createHtml(o);\r
  92                 return new Ext.Template(html);\r
  93             },\r
  94 \r
  95                 <div id="prop-Ext.DomHelper-useDom"></div>/** True to force the use of DOM instead of html fragments @type Boolean */\r
  96             useDom : false,\r
  97 \r
  98             <div id="method-Ext.DomHelper-insertBefore"></div>/**\r
  99              * Creates new DOM element(s) and inserts them before el.\r
 100              * @param {Mixed} el The context element\r
 101              * @param {Object/String} o The DOM object spec (and children) or raw HTML blob\r
 102              * @param {Boolean} returnElement (optional) true to return a Ext.Element\r
 103              * @return {HTMLElement/Ext.Element} The new node\r
 104          * @hide (repeat)\r
 105              */\r
 106             insertBefore : function(el, o, returnElement){\r
 107                 return doInsert(el, o, returnElement, beforebegin);\r
 108             },\r
 109 \r
 110             <div id="method-Ext.DomHelper-insertAfter"></div>/**\r
 111              * Creates new DOM element(s) and inserts them after el.\r
 112              * @param {Mixed} el The context element\r
 113              * @param {Object} o The DOM object spec (and children)\r
 114              * @param {Boolean} returnElement (optional) true to return a Ext.Element\r
 115              * @return {HTMLElement/Ext.Element} The new node\r
 116          * @hide (repeat)\r
 117              */\r
 118             insertAfter : function(el, o, returnElement){\r
 119                 return doInsert(el, o, returnElement, afterend, 'nextSibling');\r
 120             },\r
 121 \r
 122             <div id="method-Ext.DomHelper-insertFirst"></div>/**\r
 123              * Creates new DOM element(s) and inserts them as the first child of el.\r
 124              * @param {Mixed} el The context element\r
 125              * @param {Object/String} o The DOM object spec (and children) or raw HTML blob\r
 126              * @param {Boolean} returnElement (optional) true to return a Ext.Element\r
 127              * @return {HTMLElement/Ext.Element} The new node\r
 128          * @hide (repeat)\r
 129              */\r
 130             insertFirst : function(el, o, returnElement){\r
 131                 return doInsert(el, o, returnElement, afterbegin, 'firstChild');\r
 132             },\r
 133 \r
 134             <div id="method-Ext.DomHelper-append"></div>/**\r
 135              * Creates new DOM element(s) and appends them to el.\r
 136              * @param {Mixed} el The context element\r
 137              * @param {Object/String} o The DOM object spec (and children) or raw HTML blob\r
 138              * @param {Boolean} returnElement (optional) true to return a Ext.Element\r
 139              * @return {HTMLElement/Ext.Element} The new node\r
 140          * @hide (repeat)\r
 141              */\r
 142             append: function(el, o, returnElement){\r
 143             return doInsert(el, o, returnElement, beforeend, '', true);\r
 144         },\r
 145 \r
 146             <div id="method-Ext.DomHelper-createDom"></div>/**\r
 147              * Creates new DOM element(s) without inserting them to the document.\r
 148              * @param {Object/String} o The DOM object spec (and children) or raw HTML blob\r
 149              * @return {HTMLElement} The new uninserted node\r
 150              */\r
 151         createDom: createDom\r
 152         };\r
 153         return pub;\r
 154 }());</pre>    \r
 155 </body>\r
 156 </html>