Question

我自己教JS和HTML，所以我认为编写个人页面可能是个好主意。但是，当我尝试运行包含JS文件的html文件时，JS无法工作。这是我包含JS文件的主要部分：

<head>
    <link type='text/css' rel='stylesheet' href='css/main.css'/>
    <script type='text/javascript' src='js/main.js'></script>
    <title>Honeydukes</title>
</head>

我将所有css文件放在＆＃34; css＆＃34;文件夹和所有js文件位于＆＃34; js＆＃34;文件夹下。 index.html位于根目录之外。我的js文件看起来像这样：

$(document).ready(function() {
$('#map').mouseenter(function() {
    $(this).animate({
        height: '+=20px',
        width: '+=20px'
    });
});
$('#map').mouseleave(function() {
    $(this).animate({
        height: '-=20px',
        width: '-=20px'
    });
});
});

我在这里遗漏了什么吗？有人可以看看并启发我吗？谢谢！

Answer 1

您正在使用jQuery库，但是您从未在代码中包含它们。

您可以使用以下行添加它们：

<script type='text/javascript' src='https://code.jquery.com/jquery-2.1.3.min.js'></script>

确保在你的js之前加载jQuery。最终代码应为：

<head>
    <link type='text/css' rel='stylesheet' href='css/main.css'/>
    <script type='text/javascript' src='https://code.jquery.com/jquery-2.1.3.min.js'></script>
    <script type='text/javascript' src='js/main.js'></script>
    <title>Honeydukes</title>
</head>

Answer 2

你错过了对JQuery文件的引用。没有它，这个脚本将无法运行。您需要在<script type='text/javascript' src='js/main.js'></script>

之前添加对jquery文件的引用

您可以通过CDN引用它，或者只是下载并将其复制到您的JS文件夹中。

你的代码看起来应该是这样的

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

希望这会有所帮助。

在HTML中加载时JavaScript不起作用

2 个答案: