如何在不混淆全局命名空间的情况下在其他站点中注入Javascript(包括Prototype.js)？

Question

我目前正处于一个使用Prototype库的大型站点项目,并且已经有大量的Javascript代码.

我们现在正在处理一段代码,这些代码将被"注入"其他人的网站(图片人们在他们的网站中添加了一个<script>标签),然后运行我们的代码并向他们添加一堆DOM元素和功能.现场.这将有新的代码片段,并且还将重用我们在主站点上使用的许多代码.

我遇到的问题是,在人们的页面中添加一个包含Prototype的<script>当然不是很酷.如果我们在已经使用任何框架的页面中执行此操作,我们将保证将所有内容都搞砸.
jQuery为我们提供了"重命名"$对象的选项,因此它可以很好地处理这种情况,除了显然我们没有使用jQuery,所以我们必须迁移所有内容.

现在我正在考虑一些丑陋的选择,我不确定什么是最好的......

• 重写所有内容以使用jQuery,并在任何地方重命名$对象.
• 创建一个"新"原型库,只包含我们在"注入"代码中使用的子集,并将$重命名为其他内容.然后,我必须调整我的代码的某些部分将以某种方式共享.
• 在注入的代码中根本不使用库,以尽可能保持干净,并重写共享代码以根本不使用库.这显然会堕落到我们创建我们自己的图书馆frankenstein,这可能是有史以来最糟糕的情况.

我想知道你们认为我能做些什么,以及是否有一些可以解决我所有问题的魔术选择......

例如,你认为我可以使用像Caja/Cajita这样的东西来沙箱我自己的代码并将它与网站的其他部分隔离开来,并且在那里有Prototype吗？或者我完全忽略了这一点？

我还读过一次关于bookmarklet的技术,你是否添加了这样的代码:

(function() {  /* your code */ })();

然后你的代码都在你的匿名函数中,而你根本没有触及全局命名空间.你认为我可以制作一个包含以下内容的文件:

(function() { 
   /* Full Code of the Prototype file here */
   /* All my code that will run in the "other" site */

   InitializeStuff_CreateDOMElements_AttachEventHandlers();
})();

那会有用吗？例如,它是否会实现不整合全局命名空间的目标,而不是杀死使用jQuery的站点上的功能？

或者Prototype过于复杂,以某种方式孤立它？
(注意:我想我知道这会在任何地方创建闭包,而且速度较慢,但​​我不太关心性能,我的代码没有做任何复杂的事情)

Answer 1

如果您要将代码注入其他站点，要么要求它们也包含原型，要么根本不使用库。

在我看来，任何其他选择都太具有侵入性。