docs/source/DomHelper-more.html

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