0

这是一个简单的 html 文件：

<!DOCTYPE html>
<html>
   <head>
<title>Test Uploading Func.</title>
<script type="text/javascript" src="jquery-1.7.2.min.js"></script>
<script type="text/javascript" charset="utf-8" src="jquery-1.7.2.js">                  </script>        
<link type="text/css" href="jquery-ui-1.8.21.custom.css" rel="Stylesheet" />
    <script type="text/javascript" src="jquery-ui-1.8.21.custom.min.js"></script>

        <!--Include js file-->
        <script type="text/javascript" src="upload.js" ></script>
</head>
<body>
    <button id="Upload" value="upload">upload</button>      
    <script type="text/javascript" src="upload.js" ></script>
</body>

这是我要包含的 js 文件：

$( '#Upload' ).bind('click', function(){
alert(">");
});

如果我只是在开头包含 js 文件，选择器 #无法知道 id Upload所以我必须在文件末尾再次包含它......我知道它不正确。但是不知道怎么解决？我们不只是在标签head中包含所有 js 文件吗？我展示的合适的编码风格是什么？谢谢。

更新问题！！！

如果我有很多这样的场景，我应该在所有函数中添加“$(document).ready()”吗？有点奇怪......还有另一种方法吗？或者 Web 开发人员总是这样做。

我应该在哪里包含我的 js 文件？在开始还是结束？

如果我最后把它们都包括在内，就不会出现这种问题。那为什么很多人一开始就包含js文件呢？

4

4 回答 4

2

在选择元素之前等待 DOM准备好：

$(document).ready(function () {
    $( '#Upload' ).bind('click', function(){
        alert(">");
    });
});

更新：

如果您正在操作代码运行时希望出现在页面上的元素，则应始终使用。$(document).ready(...)如果您的代码在<head></head>文档中，这一点尤其重要。

如果您的代码在标签内，则不需要使用，但请注意两者之间存在差异。$(document).ready(...)</body>

于 2012-09-16T13:06:03.577 回答
1

为什么不检查$(document).ready()并只包含一次：

$(document).ready(function() {
    $( '#Upload' ).bind('click', function(){
        alert(">");
    });
});
于 2012-09-16T13:05:29.513 回答
1

通常认为将所有脚本放在 body 标签的底部是更好的做法。我通常不会的唯一一次是需要位于顶部的专用脚本，例如 HTML5 shiv 或某些分析脚本。

主要原因是脚本解释暂停了 HTML/CSS 渲染，这实际上会降低感知的加载时间性能。

附带的好处是您通常不必担心 DOM 就绪事件，因为当您的脚本在引用元素下方触发时，您可以确定 HTML 已经“就绪”。

于 2013-10-16T16:17:14.197 回答
0

如果您使用 jQuery，则应始终将其放入，
$(document).ready(function(){ ... code here ... });
或者
$(function(){ ... code here ... })
如果您不知道要引用的元素是否已加载。这样您就可以确保一切都按您的预期进行。此功能还有另一个问题，但这是最重要的。

于 2012-09-16T13:49:10.833 回答