javascript - prototype 和jQuery 和平共处？

Question

我对 JavaScript 知之甚少，但尽管如此，我还是试图在我的 wordpress 博客上拼凑一些东西。它不起作用，我不知道如何解决它，嘿，这就是 StackOverflow 的用途，对吧？

首先，错误信息是:

Error: element.dispatchEvent is not a function
Source File: http://.../wp-includes/js/prototype.js?ver=1.6
Line: 3936

它发生在页面加载时。我的页面加载处理程序是这样注册的:

Event.observe(window, 'load', show_dates_as_local_time);

如果我禁用其他一些插件，错误就会消失，这(加上谷歌搜索)让我得出结论，这是原型(prototype)和 jQuery(其他一些插件使用的)之间的冲突。

其次，我遵循 wordpress 推荐的使用 wp_enqeue_script 的做法将我的 JavaScript 的依赖项添加到 Prototype 库，如下所示:

add_action( 'wp_print_scripts', 'depo_theme_add_javascript' );

function depo_theme_add_javascript() {
    wp_enqueue_script('friendly_dates', 'javascript/friendly_dates.js', array('prototype'));
}

现在我也意识到 jQuery 和 Prototype 之间存在一些潜在的冲突，这些冲突可以使用 jQuery noConflicts 方法解决。我试过从不同的地方打电话，但没有用。我认为这不是问题所在，因为 a) noConflict 函数只与 $ 变量相关，这似乎不是这里的问题，b) 我希望 wordpress 帮我解决这个问题，因为它可以...

最后，使用 Venkman 调试器，我确定错误消息中引用的 element 确实是 HTMLDocument，但也缺少 dispatchEvent。不确定这是怎么发生的，因为它是标准的 DOM 方法？

Answer 1

许多库都使用了一个我特别喜欢的讨厌的把戏，原型(prototype)似乎就是其中之一。

Mootools 就是这样做的，如果我是对的，它涉及重载许多基本类的原型(prototype)，猴子修补它们。

同样，当存在 mootools 和 jQuery 时，我同样遇到了奇怪的行为，通常 jQuery 会死掉，因为它正在调用一些对象方法，而这些方法已经被 Mootools 以某种方式重载/猴子修补。

此外，神秘的是，将 mootools 从脚本使用列表中移除后，一切 运行得更快，我断定这是由于较少的对象污染。

现在我可能是错的，但我根据我的经验得出结论，这些库只是不喜欢彼此共存，并且看到 mootools 代码在我看来如何降低正常事情的完成速度，我吸收所有基于 mootools 的代码并将其移植到 jQuery(我向你保证这是一项耗时的交易)，结果是代码快速 并且没有奇怪的错误那是无法解释的。

我建议您至少将迁移视为一个选项。

写作时还有一件事:

我倾向于将此语法与我所有的 jQuery 驱动代码一起使用，以便在有人以某种方式破坏“$”的情况下进行一些安全封装。

运行时代码在执行之前等待 document.ready:

 jQuery(function($){ 
      code_with_$_here; 
 }); 

jQuery 插件

(function($){ 
    code_with_$_here; 
})(jQuery); 

使用这些将使人们更容易使用您碰巧编写的任何 jQuery，从而能够在没有太多冲突问题的情况下使用它。

这基本上会让他们确保他们的代码没有做任何真正神奇的事情。