Javascript YUI 读码日记之 YAHOO.util.Dom - Part.2 0


Posted in Javascript onMarch 22, 2008

batch: function(el, method, o, override) {
    // 让 el 始终为 HTMLElement
    el = (el && (el.tagName || el.item)) ? el : Y.Dom.get(el); 

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

    //  确定返回的对象
    var scope = (override) ? o : window;

    // 看起来是个 HTMLElement 或者不是 Array
    if (el.tagName || el.length === undefined) {
        return method.call(scope, el, o);
    } 

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

    return collection;
},小马补充

batch 是 YUI Dom 库的核心之一。它最大的意义在于,它让 Dom 库的其他大多方法
的第一个参数可以是一个 id / 元素对象 或 一组 id/元素对象,减少了循环的使用。在这里可以找到 call 与 apply 的用法。在了解了 batch 以后,下来看 YUI.util.Dom 是怎么使用这一方法的,一口气看两个函数

getStyle: function(el, property) {
    // toCamel 函数后面介绍
    property = toCamel(property);

    // 获取节点的样式
    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);

    // 设置节点的样式
    var f = function(element) {
        setStyle(element, property, val);        
    };

    Y.Dom.batch(el, f, Y.Dom, true);
},有关这两个函数的具体用法,可以看下相关的文档。其实从参数上就很容易理解怎么使用。看上面的两个函数有利于理解 YAHOO.util.Dom.batch 的调用方式。

接下来,粗略看下 getXY

getXY: function(el) {
    var f = function(el) {
        // 确定元素是否“肉眼可见”
        if ( (el.parentNode === null || el.offsetParent === null ||
                this.getStyle(el, 'display') == 'none') && 
                            el != el.ownerDocument.body) {
            return false;
        }

        return getXY(el);
    };

    return Y.Dom.batch(el, f, Y.Dom, true);
},getX 与 getY 方法也是调用此函数,只是获取返回值的数组元素不一样。由于浏览器的兼容问题,提供给用户的 YAHOO.util.Dom.getXY 也仅仅是判断变量以后,再扔给最为复杂的内部 getXY 函数。

OK,留下太多的“悬念”了,下一期着重将它们解决。

Javascript 相关文章推荐
获取URL地址中的文件名和参数的javascript代码
Sep 02 Javascript
关于js类的定义
Jun 28 Javascript
只需20行代码就可以写出CSS覆盖率测试脚本
Apr 24 Javascript
js 实现菜单上下显示附效果图
Nov 21 Javascript
jQuery元素的隐藏与显示实例
Jan 20 Javascript
JavaScript获取文本框内选中文本的方法
Feb 20 Javascript
jquery实现文本框textarea自适应高度
Mar 09 Javascript
jQuery图片轮播插件——前端开发必看
May 31 Javascript
jQuery双向列表选择器DIV模拟版
Nov 01 Javascript
Web前端框架bootstrap实战【第一次接触使用】
Dec 28 Javascript
JS库中的Particles.js在vue上的运用案例分析
Sep 13 Javascript
js屏蔽退格键(backspace或者叫后退键与F5)
Feb 10 Javascript
YUI 读码日记之 YAHOO.util.Dom - Part.1
Mar 22 #Javascript
YUI 读码日记之 YAHOO.lang.is*
Mar 22 #Javascript
详解new function(){}和function(){}() 区别分析
Mar 22 #Javascript
Javascript的一种模块模式
Mar 22 #Javascript
javascript cookie解码函数(兼容ff)
Mar 17 #Javascript
简单的JS多重继承示例
Mar 13 #Javascript
JMenuTab简单使用说明
Mar 13 #Javascript
You might like
THINKPHP+JS实现缩放图片式截图的实现
2010/03/07 PHP
支持中文和其他编码的php截取字符串函数分享(截取中文字符串)
2014/03/13 PHP
5款适合PHP使用的HTML编辑器推荐
2015/07/03 PHP
图文详解phpstorm配置Xdebug进行调试PHP教程
2016/06/13 PHP
完美的php分页类
2017/10/24 PHP
JavaScript sub方法入门实例(把字符串显示为下标)
2014/10/17 Javascript
深入探密Javascript数组方法
2015/01/08 Javascript
jQuery实现选中弹出窗口选择框内容后赋值给文本框的方法
2015/11/23 Javascript
jQuery插件实现多级联动菜单效果
2015/12/01 Javascript
AngularJS Module方法详解
2015/12/08 Javascript
基于JavaScript实现一定时间后去执行一个函数
2015/12/14 Javascript
JavaScript常用字符串与数组扩展函数小结
2016/04/24 Javascript
JavaScript中实现键值对应的字典与哈希表结构的示例
2016/06/12 Javascript
利用原生JS自动生成文章标题树的实例
2016/08/22 Javascript
JQ选择器_选择同类元素的第N个子元素的实现方法
2016/09/08 Javascript
Vue表单验证插件Vue Validator使用方法详解
2017/04/07 Javascript
vue2实现移动端上传、预览、压缩图片解决拍照旋转问题
2017/04/13 Javascript
H5图片压缩与上传实例
2017/04/21 Javascript
微信小程序实现缓存根据不同的id来进行设置和读取缓存
2017/06/12 Javascript
深入浅析ES6 Class 中的 super 关键字
2017/10/20 Javascript
Vue中添加手机验证码组件功能操作方法
2017/12/07 Javascript
Vue 进入/离开动画效果
2017/12/26 Javascript
taro小程序添加骨架屏的实现代码
2019/11/15 Javascript
python的else子句使用指南
2016/02/27 Python
解决安装python库时windows error5 报错的问题
2018/10/21 Python
浅谈Python接口对json串的处理方法
2018/12/19 Python
pytorch查看torch.Tensor和model是否在CUDA上的实例
2020/01/03 Python
python判断正负数方式
2020/06/03 Python
Python经典五人分鱼实例讲解
2021/01/04 Python
UNIX操作系统结构由哪几部分组成
2016/02/17 面试题
工程班组长岗位职责
2013/12/30 职场文书
安全大检查反思材料
2014/01/31 职场文书
《春天来了》教学反思
2014/04/07 职场文书
优质护理服务演讲稿
2014/05/07 职场文书
2014年幼儿园园务工作总结
2014/12/05 职场文书
上班迟到检讨书
2015/05/06 职场文书