安装jQuery-我错过了什么

我对从头开始编码和使用Aptana Studios非常陌生。我只是通过Codeacademy网站学会了编码，所以尽管我会编码，但我不熟悉使用Aptana这样的程序，链接文档和术语。因此，我提前为这个问题的长度道歉。简而言之，我想要一个关于如何"安装"jQuery的完整解释。我不确定在这种情况下"installed"这个词是否是正确的选择，所以我在下面提供了我的问题的更详细的描述。

当我为自己设置的网页任务编写HTML和CSS时，一切都很顺利——当我需要使用jQuery时，我遇到了问题。我想使用的代码是：

$(document).ready(function(){
    $('table').hide();
});

^^（只是为了防止我在某个地方犯了一个愚蠢的错误）^^

我认为我将Javascript文件链接到HTML的方式有问题，或者我未能正确"安装"jQuery。这就是我访问jQuery所做的：

我将jQuery网站上的代码复制到一个.js文档中，并将其保存在保存所有HTML和CSS文档的同一文件夹中。然后我把它链接到HTML上，如下所示：

<script type='text/javascript' src='jquery.js'></script>

我完全找不到任何一种教程来详细解释这是如何完成的。甚至jQuery网站的解释在我看来也很模糊

在此之后，我使用将自己的代码链接到HTML

<script type="text/javascript" src="barns.js"></script>

当它没有成功时，我并不感到惊讶，所以我继续寻找答案，但我一无所获。这可能更多的是因为我是如何被教导编码的，而不是缺乏解释——即使在这个问题中，我对编码词汇的了解也很明显——但相信我，我最不想做的就是问问自己，所以我真的不会这么做，除非我真的没有选择了。

在页面中包含jQuery有多种方法。你可以使用这样的CDN：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

或者按照你使用它的方式，有一个本地副本并包含它。

<script type='text/javascript' src='jquery.js'></script>

请注意，要使用第二种方法，必须确保脚本的路径是正确的。因此，上面的代码表示jquery.js与正在查看的页面位于同一目录中。接下来，您必须确保命名为barns.js的自定义脚本也在同一目录中，并且声明位于jQuery的声明之后。

<script type='text/javascript' src='jquery.js'></script>
<script type="text/javascript" src="barns.js"></script>

最后要记住的一些提示：

使用浏览器的开发人员工具查看控制台以查看任何错误。如果你不知道这是什么，谷歌一下
使用console.log将内容打印到开发人员工具中的控制台，以确保代码的某些部分正在运行。这是一种非常有用的调试技术。例如，您可以将console.log('in script');放在自定义JS脚本的顶部，以确保脚本被正确引入。这可以帮助消除由于脚本路径错误而导致的错误
使用jQuery文档。太棒了
尝试并享受乐趣

一个使用jQuery隐藏表的快速简单工作示例：

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8" />
    <title>jQuery</title>
  </head>
  <body>
    <h1>Red table should not be visible</h1>
    <table style="background: red;">
      <tr><td>If you see this, jQuery is not working</td></tr>
    </table>
    <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
    <script>
      jQuery( function( $ ){
        $( 'table' ).hide();
      });
    </script>
  </body>
</html>

您的代码可能无法工作，因为没有加载脚本（src属性不正确）

添加jQuery的最简单方法（因为它也是一个不错的选项）是使用cdn，如cdnjs.com:

在结束男孩标签（</body>）前添加此行：

<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.0.3/jquery.min.js"></script>

当使用CDN时，jQuery JavaScript文件不需要在本地下载，因为它托管在CDN服务器上。因此，它消除了对本地js文件的正确路径的需求——这可能就是您出现"未捕获引用错误：$is not defined"错误的原因。

有关CDN的更多信息：
http://en.wikipedia.org/wiki/Content_delivery_network

相关内容

最新更新

热门标签：