如何检查网页中是否包含某个JS文件？

Question

在我的自定义 JS 代码文件中，我使用了各种插件，例如 JQuery 的 Masonry 插件。但是，我不会在每个页面或母版页文件级别上包含该插件（有些是，有些不是），但我确实在每个页面上都包含了我的自定义文件。因此，如果缺少 Masonry 插件，我的 JS 文件中的代码将发出错误。

如果有人可以回复如何解决以下问题：

1. 检查是否引用（包含）某些 JS 插件，然后仅运行代码，
2. （可选）如果文件丢失，则在运行时包含该文件。

我让它与 JQuery 和 JQuery UI 一起使用，因为它们都在 DOM 结构中引入了一个类（jquery 和 jquery.ui 对象），但还有其他插件，如灯箱脚本、前面提到的 Masonry 等。

Answer 1

我不会检查某个特定的 JavaScript 文件是否已被“包含”，而只是检查您需要的功能是否可用（即，如果您需要一个名为 foo 的函数，只需执行以下操作即可typeof foo == 'undefined' 来查看它是否存在...）。

Answer 2

您尝试做的事情可能是一个坏主意，但无论如何，这里是如何确定给定插件是否已定义的方法。在 jQuery 中，它们只是 jQuery 范围的命名空间：

if(!jQuery().somePlugin) {
    // the plugin is not loaded => load it:
    jQuery.getScript('/url_of_the_plugin', function() {
        // the plugin is now loaded => use it
    });
}

Answer 3

在您的情况下，您只能检查其类或方法是否已定义：

if (typeof($.fn.masonry) == 'undefined') ...

无论如何，我建议在每一页上包含每个脚本，并将其压缩到一个文件中。下载和解析可能不需要的代码的成本通常远远低于多个 HTTP 请求的损失。