dom-base-debug.js revision 931e86d9347e296b2faa2e896a679f787f0edba6
998276643802ff9fb197fe220cbd9552da00a624Luke Smith(function(Y) {
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * The DOM utility provides a cross-browser abtraction layer
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * normalizing DOM tasks, and adds extra helper functionality
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * for other common tasks.
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * @module dom
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * @submodule dom-base
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * Provides DOM helper methods.
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * @class DOM
998276643802ff9fb197fe220cbd9552da00a624Luke Smith COMPARE_DOCUMENT_POSITION = 'compareDocumentPosition',
998276643802ff9fb197fe220cbd9552da00a624Luke Smith re_tag = /<([a-z]+)/i;
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * Returns the HTMLElement with the given ID (Wrapper for document.getElementById).
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * @method byId
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * @param {String} id the id attribute
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * @param {Object} doc optional The document to search. Defaults to current document
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * @return {HTMLElement | null} The HTMLElement with the id, or null if none found.
998276643802ff9fb197fe220cbd9552da00a624Luke Smith // handle dupe IDs and IE name collision
998276643802ff9fb197fe220cbd9552da00a624Luke Smith // @deprecated
4612c07daf3859e6ebfc408dc0ef9aed5f97f166Luke Smith // @deprecated
998276643802ff9fb197fe220cbd9552da00a624Luke Smith return ret || null;
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * Returns the text content of the HTMLElement.
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * @method getText
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * @param {HTMLElement} element The html element.
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * @return {String} The text content of the element (includes text of any descending elements).
998276643802ff9fb197fe220cbd9552da00a624Luke Smith getText: (documentElement.textContent !== undefined) ?
998276643802ff9fb197fe220cbd9552da00a624Luke Smith } : function(element) {
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * Sets the text content of the HTMLElement.
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * @method setText
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * @param {HTMLElement} element The html element.
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * @param {String} content The content to add.
998276643802ff9fb197fe220cbd9552da00a624Luke Smith setText: (documentElement.textContent !== undefined) ?
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * Finds the previous sibling of the element.
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * @method previous
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * @deprecated Use elementByAxis
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * @param {HTMLElement} element The html element.
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * @param {Function} fn optional An optional boolean test to apply.
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * The optional function is passed the current DOM node being tested as its only argument.
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * If no function is given, the first sibling is returned.
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * @param {Boolean} all optional Whether all node types should be scanned, or just element nodes.
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * @return {HTMLElement | null} The matching DOM node or null if none found.
998276643802ff9fb197fe220cbd9552da00a624Luke Smith return Y.DOM.elementByAxis(element, PREVIOUS_SIBLING, fn, all);
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * Finds the next sibling of the element.
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * @method next
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * @deprecated Use elementByAxis
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * @param {HTMLElement} element The html element.
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * @param {Function} fn optional An optional boolean test to apply.
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * The optional function is passed the current DOM node being tested as its only argument.
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * If no function is given, the first sibling is returned.
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * @param {Boolean} all optional Whether all node types should be scanned, or just element nodes.
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * @return {HTMLElement | null} The matching DOM node or null if none found.
998276643802ff9fb197fe220cbd9552da00a624Luke Smith return Y.DOM.elementByAxis(element, NEXT_SIBLING, fn, all);
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * Finds the ancestor of the element.
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * @method ancestor
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * @deprecated Use elementByAxis
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * @param {HTMLElement} element The html element.
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * @param {Function} fn optional An optional boolean test to apply.
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * The optional function is passed the current DOM node being tested as its only argument.
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * If no function is given, the parentNode is returned.
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * @param {Boolean} testSelf optional Whether or not to include the element in the scan
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * @return {HTMLElement | null} The matching DOM node or null if none found.
998276643802ff9fb197fe220cbd9552da00a624Luke Smith return ret || Y.DOM.elementByAxis(element, PARENT_NODE, fn, null);
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * Searches the element by the given axis for the first matching element.
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * @method elementByAxis
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * @param {HTMLElement} element The html element.
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * @param {String} axis The axis to search (parentNode, nextSibling, previousSibling).
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * @param {Function} fn optional An optional boolean test to apply.
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * @param {Boolean} all optional Whether all node types should be returned, or just element nodes.
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * The optional function is passed the current HTMLElement being tested as its only argument.
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * If no function is given, the first element is returned.
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * @return {HTMLElement | null} The matching element or null if none found.
998276643802ff9fb197fe220cbd9552da00a624Luke Smith elementByAxis: function(element, axis, fn, all) {
998276643802ff9fb197fe220cbd9552da00a624Luke Smith while (element && (element = element[axis])) { // NOTE: assignment
998276643802ff9fb197fe220cbd9552da00a624Luke Smith if ( (all || element[TAG_NAME]) && (!fn || fn(element)) ) {
998276643802ff9fb197fe220cbd9552da00a624Luke Smith return null;
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * Determines whether or not one HTMLElement is or contains another HTMLElement.
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * @method contains
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * @param {HTMLElement} element The containing html element.
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * @param {HTMLElement} needle The html element that may be contained.
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * @return {Boolean} Whether or not the element is or contains the needle.
998276643802ff9fb197fe220cbd9552da00a624Luke Smith var ret = false;
998276643802ff9fb197fe220cbd9552da00a624Luke Smith if ( !needle || !element || !needle[NODE_TYPE] || !element[NODE_TYPE]) {
998276643802ff9fb197fe220cbd9552da00a624Luke Smith if (Y.UA.opera || needle[NODE_TYPE] === 1) { // IE & SAF contains fail if needle not an ELEMENT_NODE
998276643802ff9fb197fe220cbd9552da00a624Luke Smith } else if (element[COMPARE_DOCUMENT_POSITION]) { // gecko
998276643802ff9fb197fe220cbd9552da00a624Luke Smith if (element === needle || !!(element[COMPARE_DOCUMENT_POSITION](needle) & 16)) {
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * Determines whether or not the HTMLElement is part of the document.
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * @method inDoc
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * @param {HTMLElement} element The containing html element.
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * @param {HTMLElement} doc optional The document to check.
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * @return {Boolean} Whether or not the element is attached to the document.
998276643802ff9fb197fe220cbd9552da00a624Luke Smith var ret = false,
998276643802ff9fb197fe220cbd9552da00a624Luke Smith // contains only works with HTML_ELEMENT
998276643802ff9fb197fe220cbd9552da00a624Luke Smith if (rootNode && rootNode.contains && element.tagName) {
998276643802ff9fb197fe220cbd9552da00a624Luke Smith ret = root.querySelectorAll('[id="' + id + '"]');
998276643802ff9fb197fe220cbd9552da00a624Luke Smith if (nodes && nodes.nodeType) { // root.all may return one or many
998276643802ff9fb197fe220cbd9552da00a624Luke Smith for (i = 0; node = nodes[i++];) { // check for a match
998276643802ff9fb197fe220cbd9552da00a624Luke Smith && node.attributes.id.value === id) { // avoid false positive for node.name & form.id
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * Creates a new dom node using the provided markup string.
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * @method create
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * @param {String} html The markup used to create the element
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * @param {HTMLDocument} doc An optional document context
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * @return {HTMLElement|DocumentFragment} returns a single HTMLElement
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * when creating one node, and a documentFragment when creating
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * multiple nodes.
998276643802ff9fb197fe220cbd9552da00a624Luke Smith html = Y.Lang.trim(html); // match IE which trims whitespace from innerHTML
998276643802ff9fb197fe220cbd9552da00a624Luke Smith if (html != undefined) { // not undefined or null
998276643802ff9fb197fe220cbd9552da00a624Luke Smith if (nodes.length === 1) { // return single node, breaking parentNode ref from "fragment"
998276643802ff9fb197fe220cbd9552da00a624Luke Smith } else if (nodes[0] && nodes[0].className === 'yui3-big-dummy') { // using dummy node to preserve some attributes (e.g. OPTION not selected)
998276643802ff9fb197fe220cbd9552da00a624Luke Smith } else { // return multiple nodes as a fragment
998276643802ff9fb197fe220cbd9552da00a624Luke Smith if (nodes && (nodes.push || nodes.item) && nodes[0]) {
998276643802ff9fb197fe220cbd9552da00a624Luke Smith if (nodes.item) { // convert live list to static array
998276643802ff9fb197fe220cbd9552da00a624Luke Smith } // else inline with log for minification
998276643802ff9fb197fe220cbd9552da00a624Luke Smith else { Y.log('unable to convert ' + nodes + ' to fragment', 'warn', 'dom'); }
998276643802ff9fb197fe220cbd9552da00a624Luke Smith CUSTOM_ATTRIBUTES: (!documentElement.hasAttribute) ? { // IE < 8
998276643802ff9fb197fe220cbd9552da00a624Luke Smith } : { // w3c
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * Provides a normalized attribute interface.
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * @method setAttibute
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * @param {String | HTMLElement} el The target element for the attribute.
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * @param {String} attr The attribute to set.
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * @param {String} val The value of the attribute.
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * Provides a normalized attribute interface.
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * @method getAttibute
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * @param {String | HTMLElement} el The target element for the attribute.
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * @param {String} attr The attribute to get.
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * @return {String} The current value of the attribute.
998276643802ff9fb197fe220cbd9552da00a624Luke Smith if (ret === null) {
998276643802ff9fb197fe220cbd9552da00a624Luke Smith frag = Y.DOM._fragClones[tag] = doc.createElement(tag);
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * Inserts content in a node at the given location
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * @method addHTML
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * @param {HTMLElement} node The node to insert into
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * @param {String | HTMLElement} content The content to be inserted
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * @param {String | HTMLElement} where Where to insert the content
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * If no "where" is given, content is appended to the node
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * Possible values for "where"
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * <dt>HTMLElement</dt>
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * <dd>The element to insert before</dd>
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * <dt>"replace"</dt>
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * <dd>Replaces the existing HTML</dd>
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * <dt>"before"</dt>
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * <dd>Inserts before the existing HTML</dd>
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * <dt>"before"</dt>
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * <dd>Inserts content before the node</dd>
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * <dt>"after"</dt>
998276643802ff9fb197fe220cbd9552da00a624Luke Smith * <dd>Inserts content after the node</dd>
998276643802ff9fb197fe220cbd9552da00a624Luke Smith } else { // create from string and cache
998276643802ff9fb197fe220cbd9552da00a624Luke Smith if (where.nodeType) { // insert regardless of relationship to node
998276643802ff9fb197fe220cbd9552da00a624Luke Smith // TODO: check if node.contains(where)?
998276643802ff9fb197fe220cbd9552da00a624Luke Smith case 'replace':
998276643802ff9fb197fe220cbd9552da00a624Luke Smith if (newNode) { // allow empty content to clear node
998276643802ff9fb197fe220cbd9552da00a624Luke Smith case 'before':
998276643802ff9fb197fe220cbd9552da00a624Luke Smith case 'after':
998276643802ff9fb197fe220cbd9552da00a624Luke Smith if (node.nextSibling) { // IE errors if refNode is null
998276643802ff9fb197fe220cbd9552da00a624Luke Smith nodeParent.insertBefore(newNode, node.nextSibling);
998276643802ff9fb197fe220cbd9552da00a624Luke Smith getter = Y.DOM.VALUE_GETTERS[node[TAG_NAME].toLowerCase()];
998276643802ff9fb197fe220cbd9552da00a624Luke Smith // workaround for IE8 JSON stringify bug
998276643802ff9fb197fe220cbd9552da00a624Luke Smith // which converts empty string values to null
998276643802ff9fb197fe220cbd9552da00a624Luke Smith setter = Y.DOM.VALUE_SETTERS[node[TAG_NAME].toLowerCase()];
var nodes = [],
return nodes;
while (needle) {
if (element) {
return doc;
var result,
ret = [];
creators: {},
return frag;
return frag;
if (!attr) {
return create('<select><option class="yui3-big-dummy" selected></option>' + html + '</select>', doc);
return val;
if (add) {