代码之家 › 专栏 › 技术社区 › jerone

在一个脚本中支持多个javascript库

javascript

jerone · 技术社区 · 15 年前

我正在用Javascript开发一个新项目,我想稍后发布。除了其他功能外,这个脚本还需要一些DOM操作。为了使这个XB(跨浏览器)不再发明轮子,我需要现有的javascript库的帮助。因为有很多伟大的图书馆,我不想为这个项目强制一个图书馆。这就是我想要的原因 在一个脚本中支持多个库 .

我知道我的jquery,但其他的图书馆我没有足够的经验。 因此,我想知道是否有一个教程或文章可以说明在一个脚本中支持多个JavaScript库 ?

我在某个地方读到过,CSS选择器引擎(sizzle、selector.js、peppy、nwmatcher、cssquery)也有同样的可能,但我不知道JS。

3 回复 | 直到 15 年前

Drew Wills 15 年前

好吧,使用jquery,您可以使用$.noconflict()函数从全局命名空间中删除“$”和“jquery”变量,以防止在页的其他部分使用另一个版本的jquery或声明“$”变量的其他库时出现可能的问题。

下面是一个简单的例子…

<script src="/path/to/jquery.min.js" type="text/javascript"></script>
<!-- load plugins you require here -->
<script type="text/javascript">

var myUniquelyNamedVar = {};
myUniquelyNamedVar.jQuery = $.noConflict(true);  // de-aliases jQuery, but gives you a private reference (if you need it)

(function($) {
    // use an anonymous function and pass in your private jQuery instance;  inside this function you can use $ like normal...
})(myUniquelyNamedVar.jQuery);
</script>

我在JSR-168 portlet中使用了这种方法,并取得了巨大的成功。它允许我在一个页面上有几个portlet,每个portlet可以使用不同版本的jquery或不同的插件。

bobince 15 年前

我不认为有太多的共同框架是相似的,足以有效地抽象它们。尽可能多地使用常规的DOM。

关于唯一有用的、可重用的操作,我可以想到许多框架以类似的方式提供的是选择器引擎。比如:

function querySelectorAll(selector) {
    if ('querySelectorAll' in document)
        return document.querySelectorAll(selector);  // native Selectors-API is best
    if ('jQuery' in window)
        return jQuery(selector);  // returns a wrapper object, but it's enough like an array
    if ('$$' in window)
        return $$(selector);  // prototype
    if ('YAHOO' in window && 'util' in YAHOO && 'Selector' in YAHOO.util)
        return YAHOO.util.Selector.query(selector);  // yui
    // others?
    throw 'No selector engine found';
}