Dashboard sipadu mbip
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

dom-create-debug.js 8.7KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286
  1. /*
  2. Copyright (c) 2010, Yahoo! Inc. All rights reserved.
  3. Code licensed under the BSD License:
  4. http://developer.yahoo.com/yui/license.html
  5. version: 3.4.0
  6. build: nightly
  7. */
  8. YUI.add('dom-create', function(Y) {
  9. var re_tag = /<([a-z]+)/i,
  10. Y_DOM = Y.DOM,
  11. addFeature = Y.Features.add,
  12. testFeature = Y.Features.test,
  13. creators = {},
  14. createFromDIV = function(html, tag) {
  15. var div = Y.config.doc.createElement('div'),
  16. ret = true;
  17. div.innerHTML = html;
  18. if (!div.firstChild || div.firstChild.tagName !== tag.toUpperCase()) {
  19. ret = false;
  20. }
  21. return ret;
  22. },
  23. re_tbody = /(?:\/(?:thead|tfoot|tbody|caption|col|colgroup)>)+\s*<tbody/,
  24. TABLE_OPEN = '<table>',
  25. TABLE_CLOSE = '</table>';
  26. Y.mix(Y.DOM, {
  27. _fragClones: {},
  28. _create: function(html, doc, tag) {
  29. tag = tag || 'div';
  30. var frag = Y_DOM._fragClones[tag];
  31. if (frag) {
  32. frag = frag.cloneNode(false);
  33. } else {
  34. frag = Y_DOM._fragClones[tag] = doc.createElement(tag);
  35. }
  36. frag.innerHTML = html;
  37. return frag;
  38. },
  39. /**
  40. * Creates a new dom node using the provided markup string.
  41. * @method create
  42. * @param {String} html The markup used to create the element
  43. * @param {HTMLDocument} doc An optional document context
  44. * @return {HTMLElement|DocumentFragment} returns a single HTMLElement
  45. * when creating one node, and a documentFragment when creating
  46. * multiple nodes.
  47. */
  48. create: function(html, doc) {
  49. if (typeof html === 'string') {
  50. html = Y.Lang.trim(html); // match IE which trims whitespace from innerHTML
  51. }
  52. doc = doc || Y.config.doc;
  53. var m = re_tag.exec(html),
  54. create = Y_DOM._create,
  55. custom = creators,
  56. ret = null,
  57. creator,
  58. tag, nodes;
  59. if (html != undefined) { // not undefined or null
  60. if (m && m[1]) {
  61. creator = custom[m[1].toLowerCase()];
  62. if (typeof creator === 'function') {
  63. create = creator;
  64. } else {
  65. tag = creator;
  66. }
  67. }
  68. nodes = create(html, doc, tag).childNodes;
  69. if (nodes.length === 1) { // return single node, breaking parentNode ref from "fragment"
  70. ret = nodes[0].parentNode.removeChild(nodes[0]);
  71. } else if (nodes[0] && nodes[0].className === 'yui3-big-dummy') { // using dummy node to preserve some attributes (e.g. OPTION not selected)
  72. if (nodes.length === 2) {
  73. ret = nodes[0].nextSibling;
  74. } else {
  75. nodes[0].parentNode.removeChild(nodes[0]);
  76. ret = Y_DOM._nl2frag(nodes, doc);
  77. }
  78. } else { // return multiple nodes as a fragment
  79. ret = Y_DOM._nl2frag(nodes, doc);
  80. }
  81. }
  82. return ret;
  83. },
  84. _nl2frag: function(nodes, doc) {
  85. var ret = null,
  86. i, len;
  87. if (nodes && (nodes.push || nodes.item) && nodes[0]) {
  88. doc = doc || nodes[0].ownerDocument;
  89. ret = doc.createDocumentFragment();
  90. if (nodes.item) { // convert live list to static array
  91. nodes = Y.Array(nodes, 0, true);
  92. }
  93. for (i = 0, len = nodes.length; i < len; i++) {
  94. ret.appendChild(nodes[i]);
  95. }
  96. } // else inline with log for minification
  97. else { Y.log('unable to convert ' + nodes + ' to fragment', 'warn', 'dom'); }
  98. return ret;
  99. },
  100. /**
  101. * Inserts content in a node at the given location
  102. * @method addHTML
  103. * @param {HTMLElement} node The node to insert into
  104. * @param {HTMLElement | Array | HTMLCollection} content The content to be inserted
  105. * @param {HTMLElement} where Where to insert the content
  106. * If no "where" is given, content is appended to the node
  107. * Possible values for "where"
  108. * <dl>
  109. * <dt>HTMLElement</dt>
  110. * <dd>The element to insert before</dd>
  111. * <dt>"replace"</dt>
  112. * <dd>Replaces the existing HTML</dd>
  113. * <dt>"before"</dt>
  114. * <dd>Inserts before the existing HTML</dd>
  115. * <dt>"before"</dt>
  116. * <dd>Inserts content before the node</dd>
  117. * <dt>"after"</dt>
  118. * <dd>Inserts content after the node</dd>
  119. * </dl>
  120. */
  121. addHTML: function(node, content, where) {
  122. var nodeParent = node.parentNode,
  123. i = 0,
  124. item,
  125. ret = content,
  126. newNode;
  127. if (content != undefined) { // not null or undefined (maybe 0)
  128. if (content.nodeType) { // DOM node, just add it
  129. newNode = content;
  130. } else if (typeof content == 'string' || typeof content == 'number') {
  131. ret = newNode = Y_DOM.create(content);
  132. } else if (content[0] && content[0].nodeType) { // array or collection
  133. newNode = Y.config.doc.createDocumentFragment();
  134. while ((item = content[i++])) {
  135. newNode.appendChild(item); // append to fragment for insertion
  136. }
  137. }
  138. }
  139. if (where) {
  140. if (where.nodeType) { // insert regardless of relationship to node
  141. where.parentNode.insertBefore(newNode, where);
  142. } else {
  143. switch (where) {
  144. case 'replace':
  145. while (node.firstChild) {
  146. node.removeChild(node.firstChild);
  147. }
  148. if (newNode) { // allow empty content to clear node
  149. node.appendChild(newNode);
  150. }
  151. break;
  152. case 'before':
  153. nodeParent.insertBefore(newNode, node);
  154. break;
  155. case 'after':
  156. if (node.nextSibling) { // IE errors if refNode is null
  157. nodeParent.insertBefore(newNode, node.nextSibling);
  158. } else {
  159. nodeParent.appendChild(newNode);
  160. }
  161. break;
  162. default:
  163. node.appendChild(newNode);
  164. }
  165. }
  166. } else if (newNode) {
  167. node.appendChild(newNode);
  168. }
  169. return ret;
  170. }
  171. });
  172. addFeature('innerhtml', 'table', {
  173. test: function() {
  174. var node = Y.config.doc.createElement('table');
  175. try {
  176. node.innerHTML = '<tbody></tbody>';
  177. } catch(e) {
  178. return false;
  179. }
  180. return (node.firstChild && node.firstChild.nodeName === 'TBODY');
  181. }
  182. });
  183. addFeature('innerhtml-div', 'tr', {
  184. test: function() {
  185. return createFromDIV('<tr></tr>', 'tr');
  186. }
  187. });
  188. addFeature('innerhtml-div', 'script', {
  189. test: function() {
  190. return createFromDIV('<script></script>', 'script');
  191. }
  192. });
  193. if (!testFeature('innerhtml', 'table')) {
  194. // TODO: thead/tfoot with nested tbody
  195. // IE adds TBODY when creating TABLE elements (which may share this impl)
  196. creators.tbody = function(html, doc) {
  197. var frag = Y_DOM.create(TABLE_OPEN + html + TABLE_CLOSE, doc),
  198. tb = frag.children.tags('tbody')[0];
  199. if (frag.children.length > 1 && tb && !re_tbody.test(html)) {
  200. tb.parentNode.removeChild(tb); // strip extraneous tbody
  201. }
  202. return frag;
  203. };
  204. }
  205. if (!testFeature('innerhtml-div', 'script')) {
  206. creators.script = function(html, doc) {
  207. var frag = doc.createElement('div');
  208. frag.innerHTML = '-' + html;
  209. frag.removeChild(frag.firstChild);
  210. return frag;
  211. }
  212. creators.link = creators.style = creators.script;
  213. }
  214. if (!testFeature('innerhtml-div', 'tr')) {
  215. Y.mix(creators, {
  216. option: function(html, doc) {
  217. return Y_DOM.create('<select><option class="yui3-big-dummy" selected></option>' + html + '</select>', doc);
  218. },
  219. tr: function(html, doc) {
  220. return Y_DOM.create('<tbody>' + html + '</tbody>', doc);
  221. },
  222. td: function(html, doc) {
  223. return Y_DOM.create('<tr>' + html + '</tr>', doc);
  224. },
  225. col: function(html, doc) {
  226. return Y_DOM.create('<colgroup>' + html + '</colgroup>', doc);
  227. },
  228. tbody: 'table'
  229. });
  230. Y.mix(creators, {
  231. legend: 'fieldset',
  232. th: creators.td,
  233. thead: creators.tbody,
  234. tfoot: creators.tbody,
  235. caption: creators.tbody,
  236. colgroup: creators.tbody,
  237. optgroup: creators.option
  238. });
  239. }
  240. Y_DOM.creators = creators;
  241. }, '3.4.0' ,{requires:['dom-core']});