📄 dom.js
字号:
* @method setX * @param {String | HTMLElement | Array} el Accepts a string to use as an ID, an actual DOM reference, or an Array of IDs and/or HTMLElements. * @param {Int} x The value to use as the X coordinate for the element(s). */ setX: function(el, x) { Y.Dom.setXY(el, [x, null]); }, /** * Set the Y position of an html element in page coordinates, regardless of how the element is positioned. * The element must be part of the DOM tree to have page coordinates (display:none or elements not appended return false). * @method setY * @param {String | HTMLElement | Array} el Accepts a string to use as an ID, an actual DOM reference, or an Array of IDs and/or HTMLElements. * @param {Int} x To use as the Y coordinate for the element(s). */ setY: function(el, y) { Y.Dom.setXY(el, [null, y]); }, /** * Returns the region position of the given element. * The element must be part of the DOM tree to have a region (display:none or elements not appended return false). * @method getRegion * @param {String | HTMLElement | Array} el Accepts a string to use as an ID, an actual DOM reference, or an Array of IDs and/or HTMLElements. * @return {Region | Array} A Region or array of Region instances containing "top, left, bottom, right" member data. */ getRegion: function(el) { var f = function(el) { if ( (el.parentNode === null || el.offsetParent === null || this.getStyle(el, 'display') == 'none') && el != document.body) { return false; } var region = Y.Region.getRegion(el); return region; }; return Y.Dom.batch(el, f, Y.Dom, true); }, /** * Returns the width of the client (viewport). * @method getClientWidth * @deprecated Now using getViewportWidth. This interface left intact for back compat. * @return {Int} The width of the viewable area of the page. */ getClientWidth: function() { return Y.Dom.getViewportWidth(); }, /** * Returns the height of the client (viewport). * @method getClientHeight * @deprecated Now using getViewportHeight. This interface left intact for back compat. * @return {Int} The height of the viewable area of the page. */ getClientHeight: function() { return Y.Dom.getViewportHeight(); }, /** * Returns a array of HTMLElements with the given class. * For optimized performance, include a tag and/or root node when possible. * @method getElementsByClassName * @param {String} className The class name to match against * @param {String} tag (optional) The tag name of the elements being collected * @param {String | HTMLElement} root (optional) The HTMLElement or an ID to use as the starting point * @param {Function} apply (optional) A function to apply to each element when found * @return {Array} An array of elements that have the given class name */ getElementsByClassName: function(className, tag, root, apply) { tag = tag || '*'; root = (root) ? Y.Dom.get(root) : null || document; if (!root) { return []; } var nodes = [], elements = root.getElementsByTagName(tag), re = getClassRegEx(className); for (var i = 0, len = elements.length; i < len; ++i) { if ( re.test(elements[i].className) ) { nodes[nodes.length] = elements[i]; if (apply) { apply.call(elements[i], elements[i]); } } } return nodes; }, /** * Determines whether an HTMLElement has the given className. * @method hasClass * @param {String | HTMLElement | Array} el The element or collection to test * @param {String} className the class name to search for * @return {Boolean | Array} A boolean value or array of boolean values */ hasClass: function(el, className) { var re = getClassRegEx(className); var f = function(el) { return re.test(el.className); }; return Y.Dom.batch(el, f, Y.Dom, true); }, /** * Adds a class name to a given element or collection of elements. * @method addClass * @param {String | HTMLElement | Array} el The element or collection to add the class to * @param {String} className the class name to add to the class attribute * @return {Boolean | Array} A pass/fail boolean or array of booleans */ addClass: function(el, className) { var f = function(el) { if (this.hasClass(el, className)) { return false; // already present } el.className = YAHOO.lang.trim([el.className, className].join(' ')); return true; }; return Y.Dom.batch(el, f, Y.Dom, true); }, /** * Removes a class name from a given element or collection of elements. * @method removeClass * @param {String | HTMLElement | Array} el The element or collection to remove the class from * @param {String} className the class name to remove from the class attribute * @return {Boolean | Array} A pass/fail boolean or array of booleans */ removeClass: function(el, className) { var re = getClassRegEx(className); var f = function(el) { if (!this.hasClass(el, className)) { return false; // not present } var c = el.className; el.className = c.replace(re, ' '); if ( this.hasClass(el, className) ) { // in case of multiple adjacent this.removeClass(el, className); } el.className = YAHOO.lang.trim(el.className); // remove any trailing spaces return true; }; return Y.Dom.batch(el, f, Y.Dom, true); }, /** * Replace a class with another class for a given element or collection of elements. * If no oldClassName is present, the newClassName is simply added. * @method replaceClass * @param {String | HTMLElement | Array} el The element or collection to remove the class from * @param {String} oldClassName the class name to be replaced * @param {String} newClassName the class name that will be replacing the old class name * @return {Boolean | Array} A pass/fail boolean or array of booleans */ replaceClass: function(el, oldClassName, newClassName) { if (!newClassName || oldClassName === newClassName) { // avoid infinite loop return false; } var re = getClassRegEx(oldClassName); var f = function(el) { if ( !this.hasClass(el, oldClassName) ) { this.addClass(el, newClassName); // just add it if nothing to replace return true; // NOTE: return } el.className = el.className.replace(re, ' ' + newClassName + ' '); if ( this.hasClass(el, oldClassName) ) { // in case of multiple adjacent this.replaceClass(el, oldClassName, newClassName); } el.className = YAHOO.lang.trim(el.className); // remove any trailing spaces return true; }; return Y.Dom.batch(el, f, Y.Dom, true); }, /** * Returns an ID and applies it to the element "el", if provided. * @method generateId * @param {String | HTMLElement | Array} el (optional) An optional element array of elements to add an ID to (no ID is added if one is already present). * @param {String} prefix (optional) an optional prefix to use (defaults to "yui-gen"). * @return {String | Array} The generated ID, or array of generated IDs (or original ID if already present on an element) */ generateId: function(el, prefix) { prefix = prefix || 'yui-gen'; var f = function(el) { if (el && el.id) { // do not override existing ID return el.id; } var id = prefix + id_counter++; if (el) { el.id = id; } return id; }; // batch fails when no element, so just generate and return single ID return Y.Dom.batch(el, f, Y.Dom, true) || f.apply(Y.Dom, arguments); }, /** * Determines whether an HTMLElement is an ancestor of another HTML element in the DOM hierarchy. * @method isAncestor * @param {String | HTMLElement} haystack The possible ancestor * @param {String | HTMLElement} needle The possible descendent * @return {Boolean} Whether or not the haystack is an ancestor of needle */ isAncestor: function(haystack, needle) { haystack = Y.Dom.get(haystack); needle = Y.Dom.get(needle); if (!haystack || !needle) { return false; } if (haystack.contains && needle.nodeType && !isSafari) { // safari contains is broken return haystack.contains(needle); } else if ( haystack.compareDocumentPosition && needle.nodeType ) { return !!(haystack.compareDocumentPosition(needle) & 16); } else if (needle.nodeType) { // fallback to crawling up (safari) return !!this.getAncestorBy(needle, function(el) { return el == haystack; }); } return false; }, /** * Determines whether an HTMLElement is present in the current document. * @method inDocument * @param {String | HTMLElement} el The element to search for * @return {Boolean} Whether or not the element is present in the current document */ inDocument: function(el) { return this.isAncestor(document.documentElement, el); }, /** * Returns a array of HTMLElements that pass the test applied by supplied boolean method. * For optimized performance, include a tag and/or root node when possible. * @method getElementsBy * @param {Function} method - A boolean method for testing elements which receives the element as its only argument. * @param {String} tag (optional) The tag name of the elements being collected * @param {String | HTMLElement} root (optional) The HTMLElement or an ID to use as the starting point * @param {Function} apply (optional) A function to apply to each element when found * @return {Array} Array of HTMLElements */ getElementsBy: function(method, tag, root, apply) { tag = tag || '*'; root = (root) ? Y.Dom.get(root) : null || document; if (!root) { return []; } var nodes = [], elements = root.getElementsByTagName(tag); for (var i = 0, len = elements.length; i < len; ++i) { if ( method(elements[i]) ) { nodes[nodes.length] = elements[i]; if (apply) { apply(elements[i]); } } } return nodes; }, /** * Runs the supplied method against each item in the Collection/Array. * The method is called with the element(s) as the first arg, and the optional param as the second ( method(el, o) ). * @method batch * @param {String | HTMLElement | Array} el (optional) An element or array of elements to apply the method to * @param {Function} method The method to apply to the element(s) * @param {Any} o (optional) An optional arg that is passed to the supplied method * @param {Boolean} override (optional) Whether or not to override the scope of "method" with "o" * @return {Any | Array} The return value(s) from the supplied method */
⌨️ 快捷键说明
复制代码
Ctrl + C
搜索代码
Ctrl + F
全屏模式
F11
切换主题
Ctrl + Shift + D
显示快捷键
?
增大字号
Ctrl + =
减小字号
Ctrl + -