为JS库选择器创建库不可知包装的最佳方法是什么?我有一个自定义的JS框架,该框架旨在尽可能地与图书馆无关。我遇到的问题是,例如Mootools借助其自己的特定方法(注入,采用等)增强了返回的DOM元素,我不希望这些对于位于框架顶部的模块可见(如Nicholas) Zakas曾经描述过),以防止误用/意外。

作为一个简单的急救,我创建了一个使用Mootools的自定义选择器,然后创建了自定义Element -object / wrapper并为其选择(并增强了)Mootools DOM元素,因此,Mootools增强方法对上面的模块不直接可见。这种方法的问题是,如果没有将DOM元素(值,样式等)未专门编码为包装器(元素),则会丢失所有本机功能。

是否有另一种和/或更好的方法来做到这一点?可以扩展本机DOM元素的东西,从而自动提供本机属性/方法,并通过包装器提供高级功能(通过Mootools,jQuery,诸如此类...)。

一些示例代码,当前如何执行:

/*
 * Wrap the native library element
 */
Element = function(_libElement) {
    // Store native object
    var libElement = _libElement;

    return {
        addClass: function(_class) { libElement.addClass(_class); return this; },
        removeClass: function(_class) { libElement.removeClass(_class); return this; },
        hasClass: function(_class) { return libElement.hasClass(_class); }
    };
};

/*
 * Custom selector
 */
getElement = function(_query) {
    var elements = $$(_query);

    // Wrap each element to Element wrapper
    var num = elements.length;
    while(num--) {
        elements[num] = new Element(elements[num]);
    }

    return elements;
};

最佳答案

我的方法是不用担心,只需传回本机DOM元素即可。如果有人想依靠MooTools(或Prototype)对该DOM元素的增强,那是他们自己的监视。实际上,如果您试图阻止这些增强功能通过显示出来,那我想您不再是与图书馆无关的了-相反,您正在积极地歧视(因为缺少更好的词!)对执行本机元素的图书馆增强。 :-)使用这些库的人大概需要这些增强。

如果有人在您的库的顶部构建模块,则他们应该了解所构建的环境(这不能保证存在这些增强功能)。

有点偏离主题,但是可能值得注意的是,直接扩展DOM元素似乎已经过时了。我知道Prototype家伙正在积极计划使用包装器(a'la jQuery)来代替时间。

09-10 00:32
查看更多