个人中心
文章发布
退出
作者热门文章
- html - 出于某种原因，IE8 对我的 Sass 文件中继承的 html5 CSS 不友好？
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景？
26
4
我在将 jquery 源代码拆分为多个文件时遇到了一些问题。我真正的源代码有点复杂，但下面的简单示例很好地显示了我的问题。首先，我想向您展示一个只有一个 javascript 文件的工作示例。之后，我将描述我尝试将 javascript 拆分为两个文件的方法。
我的 html 代码如下所示(“./jquery”是指向我本地 jquery 下载的符号链接(symbolic link)):
<html>
<head>
<script src="./jquery"></script>
<script src="./file1.js"></script>
</head>
<body>
<div id="content"></div>
</body>
</html>
file1.js 中的 jquery 源代码如下所示:
$(document).ready(function() {
var Test = (function() {
var content = $('#content');
var init = function() {
content.html('<p>test</p>');
};
return {
init: init
}
})();
Test.init();
});
打开页面后，会显示“test”，因此本示例可以正常运行。
但现在我想将整个 Test 部分放入另一个文件 file2.js 中。我的 html 基本相同，但多了一行:
<script src="./file2.js"></script>
file1.js 现在只包含 init 函数的调用:
$(document).ready(function() {
Test.init();
});
而file2.js包含Test的定义:
var Test = (function() {
var content = $('#content');
var init = function() {
content.html('<p>test</p>');
};
return {
init: init
}
})();
当我打开页面时，不再显示“test”。为了确保 init 函数被调用，我添加了一个 console.log("test");到运行良好的 init 函数。因此，我认为该函数可能会在 DOM 准备好之前被调用，但实际上我对此一无所知。也许有人可以给我一个提示如何运行。
提前致以最诚挚的问候和感谢!
最佳答案
您可以根据自己的喜好做几件事...1. 将脚本移至 HTML 文件的末尾而不是 header 中...
<html>
<head>
</head>
<body>
<div id="content"></div>
</body>
<script src="./jquery"></script>
<script src="./file2.js"></script>
<script src="./file1.js"></script>
</html>
依次思考这个问题...如果你不想在每个模块中声明一个 var 来引用 DOM 中的一个元素，你需要该元素首先存在，然后你可以向模块声明“全局”var < b>内容。这样你原来的 file2.js 就可以工作了。
另一种方法是将内容声明为模块的“全局”内容，但在 init 函数中对其进行初始化...
var Test = (function() {
var content;
var init = function() {
content = $('#content');
content.html('<p>test</p>');
};
return {
init: init
}
})();
现在您可以在所有模块的函数中使用内容变量。
希望这有帮助，请告诉我。
关于javascript - 使用模块模式时如何将jquery源代码拆分为多个文件？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/31808443/
26
4
0
我正在编写一个 Java 应用程序，该应用程序检查网页的源代码，并在满足源代码中的条件时在我的默认浏览器中向我显示该网页。我通过以下方式获取源代码: String source = getUrlSou
数周以来，我一直在为 Android 上的蓝牙项目而苦苦挣扎。有谁知道我可以去哪里查看 Google 用于使其蓝牙配对和连接逻辑正常工作的实际代码？ 我浏览了所有的文档、BluetoothChat 应
关闭。这个问题不符合Stack Overflow guidelines .它目前不接受答案。 我们不允许提问寻求书籍、工具、软件库等的推荐。您可以编辑问题，以便用事实和引用来回答。 关闭 4 年前。
Android 源代码有多个目录，其中包含针对不同设备的代码。此外，在特定目录中，存在显示不同分支和标签的路径。举个例子，在“android/platform/external/iptables”目录
在哪里可以找到 SQLMembershipProvider (.NET2.0) 的源代码？ 是可用的么？ 最佳答案 源代码已经发布。 See ScottGu's blog for further de
我只想知道如何下载特定版本的 Android 源代码。我已经尝试过以下命令 repo init -u https://android.googlesource.com/platform/manifes
我想看看OpenCL框架是如何实现的。我发现的只是已经编译好的可供下载的库。 当然，OpenCL 可以有许多不同的实现，但我想看看其中的一个来了解它是如何完成的。 为了确保我自己清楚，OpenCL 框
latex 源代码列表应该是什么样子才能产生像已知书籍中那样的输出，例如 Spring 框架的输出？我尝试过使用 latex 列表包，但无法生成看起来像下面一样好的东西。因此，我主要对生成类似以下示例
PHP 是用 C 语言编写的吗？我在哪里可以在线找到 PHP 源代码而无需下载全部内容？ 最佳答案 PHP 函数是用 C 编写的 - 您可以在 lxr.php.net 找到可浏览的源代码. 例如:ht
我正在使用Elasticsearch OSS的官方Docker镜像(docker.elastic.co/elasticsearch/elasticsearch-oss:6.2.4)，似乎完全无法使用s
我试图在Cython中同时编译C和C++源代码。这是我当前的设置: -setup.py from distutils.core import setup from Cython.Build impor
好吧，事情是这样的:你们所有人可能都在想同样的事情:您可以使用 driver.getPageSource(); 这部分是正确的。唯一的问题是源代码以一种相当奇怪的方式编译，所有代码都在其中 \&quo
由于 TwoLineListItem 自 API 17 起已被弃用，因此我已采取措施将其替换为自定义 XML 和 ViewHolder。但是，我真的希望我的应用程序看起来与使用 TwoLineList
要从 HttpURLConnection 获取 InputStream，我们的代码如下 urlConnection.getInputStream(); 如果InputStream是一个Abstract
我刚刚开始学习更多关于 C/C++ 的知识，我正在使用 Visual Studio 2013 来管理代码。 我正在使用 Tobii EyeX 眼睛注视系统的项目要求我能够稍微调整此代码，但是我不明白如
我在按钮上有一个IBAction，其中包含以下代码，我尝试使用它来检索 UIWebView 的源代码: - (IBAction)loadInAWebView:(id)sender { [self
我正在 asp.net 中创建一个网站，我只是想知道有什么方法可以使用 JavaScript 从图像生成调色板吗？类似于 1) http://www.cssdrive.com/imagepalette
有人可以分享 WinKill() from AutoIt 的源代码吗？ ？ 我想知道它如何处理消息(是/否/取消)以确保它得到正确处理。我想用它来清理桌面上的意外弹出窗口。 最佳答案 正如我们在下面的
我的问题与 Opencv 的源代码有关。在我看来不同的平台the Opencv website提供不同的代码结构。我只是想知道是否有可能为所有不同的平台提供一个源代码。使用相同的源代码，我可以针对不同
这个问题在这里已经有了答案: Convert Python program to C/C++ code? [closed] (8 个答案) 关闭 3 年前。 我一直在努力寻找一种方法将 .py 源文
我是一名优秀的程序员,十分优秀！