1

我正在尝试清理我的代码，所以我把所有的东西都放在我的

<style></style>

在 CSS 文件中。我正在尝试对我的 jQuery 做同样的事情。所以我创建了一个 Custom.js 文件。但请执行以下操作：

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js"></script>

留在 html 文件中还是可以将它们移动到 Custom.js 文件中？另外，我正在使用一个名为 uscrollbar 的 jQuery 插件，所以我的 html 文件中有这段代码：

<script> 
$(document).ready(function(e) {
    $('#scroll_form').uscrollbar();
}); 
</script>​​​​​​​​​​​​​​​​​

我也可以将其移至 Custom.js 吗？

4

5 回答 5

2

一个更好的问题。

最好在您的 HTML 中保留指向外部脚本的链接，最好有几个<script>标签。尤其是那些使用 CDN 的！

您可以将您的document.ready()函数移动到外部 JS，您的所有其他 JS 都将保存在那里。但有时在只涉及该页面的页面中直接包含这样的小片段会更容易。

将内容移动到单独的文件时，以正确的顺序包含它们很重要。
通常像 Modernizr 之类的东西在顶部（<head>），jQuery 靠近底部（就在之前</body>），然后是您的插件，然后是您的自定义脚本。

于 2012-10-01T02:50:53.150 回答
1

查看RequireJS，它为您提供了一种超级简单的方法来根据需要包含 javascript 文件，而不是在页眉/页脚中塞满大量<script>标签。

于 2012-10-01T02:52:42.270 回答
0

在 HTML 代码中保留对 Javascript 文件（本地或远程）的引用。如果在 DOM 准备好之前不需要准备好它们，请将它们放在页面底部的结束 body 标记之前。例如，您的 jQuery 引用应该几乎总是在您的“head”部分，因为在 HTML 加载时任何对 jQuery 的引用都需要定义，即使在文档准备好之前不调用的函数也不需要定义。许多其他支持文件，例如“jquery.easing”，可以放在底部，从而缩短页面加载时间。

您可以将 uscrollbar() 调用移至 .js 文件，但我建议将所有“就绪”命令放在一个函数中，然后在 HTML 中简单地调用该函数就绪。IE：

<script type="text/javascript">
jQuery(document).ready(function() {
    fn_LoadFunctionName_Thats_InYour_Custom_js_files();
});
</script>

不要忘记在你的脚本标签中包含 type="text/javascript" 。

于 2012-10-01T02:51:58.250 回答
0

如果您使用的不仅仅是一个小函数调用的自定义 js，我会分离成一个新的 js 文件，然后在您的<script>标签中调用它。与 css 相同。如果您使用 jquery 更改样式，那么通常我使用addClass,removeClass和toggleClass来修改我的样式。这样您就不会忘记从 css 到 js 文件的样式。

于 2012-10-01T02:51:59.913 回答
0

您当然可以将它们移动到 Custom.js 文件中。只要确保您已将文件包含在您的 html 文件中，就像您包含了 jQuery 库一样。

<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.1/jquery.min.js"></script>
<script type="text/javascript" src="Custom.js"></script>

只需确保 Custom.js 的路径正确。此外，您不要将脚本标记放在 js 文件中。所以 Custom.js 将是：

$(document).ready(function(e) {
    $('#scroll_form').uscrollbar();
});
于 2012-10-01T02:52:24.293 回答