Home >Web Front-end >JS Tutorial >Javascript YUI code reading diary YAHOO.util.Dom - Part.2 0_YUI.Ext related

Javascript YUI code reading diary YAHOO.util.Dom - Part.2 0_YUI.Ext related

WBOY
WBOYOriginal
2016-05-16 19:05:471082browse

batch: function(el, method, o, override) {
// Let el always be HTMLElement
el = (el && (el.tagName || el.item)) ? el : Y.Dom.get (el);

if (!el || !method) {
return false;
}

// Determine the returned object
var scope = (override ) ? o : window;

// Looks like an HTMLElement or not Array
if (el.tagName || el.length === undefined) {
return method.call(scope, el, o);
}

var collection = [];
for (var i = 0, len = el.length; i collection[collection .length] = method.call(scope, el[i], o);
}

return collection;
}, Xiaoma added that

batch is the YUI Dom library one of the core. Its greatest significance is that it allows the first parameter of most other methods of the Dom library
to be an id/element object or a set of id/element objects, reducing the use of loops. Here you can find the usage of call and apply. After understanding batch, let’s take a look at how YUI.util.Dom uses this method. Let’s look at two functions in one go:

getStyle: function(el, property) {
// behind the toCamel function Introduction
property = toCamel(property);

// Get the style of the node
var f = function(element) {
return getStyle(element, property);
};

return Y.Dom.batch(el, f, Y.Dom, true);
},setStyle: function(el, property, val) {
property = toCamel(property);

// Set the style of the node
var f = function(element) {
setStyle(element, property, val);
};

Y.Dom. batch(el, f, Y.Dom, true);
}, for the specific usage of these two functions, you can read the relevant documents. In fact, it is easy to understand how to use it from the parameters. Looking at the above two functions is helpful to understand how YAHOO.util.Dom.batch is called.

Next, take a quick look at getXY

getXY: function(el) {
var f = function(el) {
// Determine whether the element is "visible to the naked eye"
if ((el.parentNode === null || el.offsetParent === null ||
this.getStyle(el, 'display') == 'none') &&
                                                                                                                      .ownerDocument.body) {
return false;
}

return getXY(el);
};

return Y.Dom.batch(el, f , Y.Dom, true);
}, getX and getY methods also call this function, but the array elements for obtaining the return value are different. Due to browser compatibility issues, the YAHOO.util.Dom.getXY provided to the user is only a judgment of the variable and then thrown to the most complex internal getXY function.

OK, there are too many "suspense" left, and the next issue will focus on solving them.

Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn