0

我正在尝试学习 jQuery，但我不明白为什么它根本不起作用。我的 index.html 很简单，如下所示：

<!DOCTYPE html>
<html>
<head>
    <title>JQuery Tutorial</title>
</head>
<body>
    $(function() { alert("Hello world!"); });

    <script src="js/jquery-1.8.0.min.js"></script>
</body>
</html>

我在本地机器上使用 XAMPP 托管网站，文件结构是这样的，在 htdocs 下：

XAMPP/xamppfiles/htdocs
...
jquerytuts2/
  index.html
  /js
    jquery-1.8.0.js
    jquery-1.8.0.min.js

jQuery 只是在浏览器中显示，纯文本。我在 Chrome、Safari、Firefox 上看到过这个，我使用的是运行 OSX 10.8.1 的 2012 MacBook Pro。

4

3 回答 3

3

$(function() { ... })在将库包含在文档中之前，您正在尝试使用 jQuery DOM 就绪方法 ( )。是的，别忘了<script></script>为你的 JavaScript 使用标签：

<!DOCTYPE html>
<html>
<head>
    <title>JQuery Tutorial</title>

    <!-- place your code here: -->
    <script src="js/jquery-1.8.0.min.js"></script>
</head>
<body>
    <!-- and don't forget the tags: -->
    <script>
        $(function() { alert("Hello world!"); });
    </script>
</body>
</html>
于 2012-08-26T17:25:03.847 回答
3 
<!DOCTYPE html>
<html>
<head>
    <title>JQuery Tutorial</title>
</head>
<body>
    <script src="js/jquery-1.8.0.min.js"></script>
    <script>
    $(function() { alert("Hello world!"); });
    </script>
</body>
</html>

解释：因为文档通常是从上到下执行的，所以在加载 jQuery 之前执行 jQuery 代码，导致网站崩溃。哦，是的，你忘了<script>在你的 JavaScript 代码周围加上一个标签。

编辑：还有一些进一步的建议：除非您有理由不这样做，否则请将您的 javascript 放在站点中其他任何内容的下方。这会导致网站加载速度更快。脚本标签的 HTML5 属性使这变得不必要（理论上）。

于 2012-08-26T17:27:30.353 回答
0

嘿，你的代码有问题..你需要把你的 jquery 代码放在脚本标签中

 <!DOCTYPE html>
    <html>
    <head>
        <title>JQuery Tutorial</title>
    </head>
    <body>
<script type="text/javascript">
        $(function() { alert("Hello world!"); });
</script>

        <script src="js/jquery-1.8.0.min.js"></script>
    </body>
    </html>

笔记

无需将您的 jquery 文件放在顶部，然后调用 ready 函数。浏览器如何呈现 DOM 是它下载所有外部文件 css、js 等。然后它用于内联标签。在这里，因为它已准备就绪，所以无论您将代码放在页面中的何处，它都不会影响。但是如果你在外部 js 文件中写了同样的东西，然后你在 jquery 文件之前包含它，它肯定会给你一个错误..

于 2012-08-26T17:28:25.843 回答