多个页面元素的javascript工作程序

多个页面元素的javascript工作程序,javascript,shared-libraries,Javascript,Shared Libraries,假设我有一个javascript库(.js文件),它可以在页面上的div元素上绘制SVG图形。该库应用业务逻辑,还为单击元素等创建事件处理程序。伪代码可能如下所示: myLib = {}; myLib.dummy = null; mylib.doStuff = function(divID) { //divID is the ID of the element on which SVG graph will be drawn //does graph drawing and sets u

假设我有一个javascript库(.js文件),它可以在页面上的div元素上绘制SVG图形。该库应用业务逻辑,还为单击元素等创建事件处理程序。伪代码可能如下所示:

myLib = {};
myLib.dummy = null;
mylib.doStuff = function(divID) {
  //divID is the ID of the element on which SVG graph will be drawn
  //does graph drawing and sets up myLib.dummy for feedback or such, e.g.:
  myLib.dummy = $("#divID").width();
}
我的问题是:如何处理这样一种情况:我希望将此脚本应用于同一页面上的2个(或更多)元素,然后将myLib的单独“实例”应用于每个元素。我知道我不能从页面上这样称呼它:

myLib.doStuff('topDiv');   //myLib.dummy will be say 400;
myLib.doStuff('bottomDiv');   //myLib.dummy will be say 600;
使用上述代码,我将不再能够访问ID为'topDiv'的div的myLib.dummy,因为它们使用相同的名称空间

我怀疑我遗漏了一个设计模式,或者答案可能只是名称空间的问题

如果有任何建议或帮助,我将不胜感激

function makeALib() {
    var myLib = {};
    myLib.dummy = null;
    mylib.doStuff = function(divID) {
      //divID is the ID of the element on which SVG graph will be drawn
      //does graph drawing and sets up myLib.dummy for feedback or such, e.g.:
      myLib.dummy = $("#divID").width();
    }
    return myLib;
}

var libA = makeALib();
var libB = makeALib();

libA.doStuff('topDiv'); 
libB.doStuff('bottomDiv'); 

有许多不同的领域,你可以介绍分离或间接。如果不了解更多的使用上下文,就很难说什么是好的选择。但以上是许多工作选择之一。

感谢rambo coder,这似乎正是我所寻找的。为了其他人的利益,我认为答案意味着libB.doStuff通常会/应该有一个不同的参数,如libB.doStuff('bottomDiv');