在同一页面上放置2份javascript

Question

我已经使用大约500行Javascript和一些html和css实现了一些功能。我想在同一页面上放置2个这样的实例。这会导致命名空间冲突。

我可以想到一种避免这种做法的乏味方法： *由于html元素是由Javascript中的ID以编程方式访问的，我需要给它们不同的ID。我需要两个版本的javascript函数来引用这些id。 *我需要单独版本的javascript状态变量。

有没有一种更简单的方法可以做到这一点，不需要那么多代码重复，但名称不同？有没有办法让每个副本在这个意义上表现得像一个单独的文档，即在单独的名称空间中？

由于

Answer 1

是：让代码的最外层功能接受它操作的id（或其他选择器），然后只需调用它两次。

如，

function doSomethingNifty(id) {
    // Your code doing nifty things with `id`
}

称之为：

doSomethingNifty("foo");
doSomethingNifty("bar");

您在 doSomethingNifty内定义的所有函数都会关闭id参数，因此他们可以访问与{{1}相关的id他们与...有关。

这是一个完整但非常简单的例子。最棒的是，这很容易扩大。模式不会改变，你只需在doSomethingNifty内放置更多。

Live Copy | Live Source

doSomethingNifty

Answer 2

如果不详细了解您正在尝试做什么，重构它可能有所帮助。

例如，为什么不先简单地编写HTML然后以完成所需工作的方式编写JS，而不是使用一段锁定的不可移植的代码。

有些东西不能很好地扩展（例如，如果你想在同一页上有4个实例会发生什么？