Question

这是我第一次尝试让我的jQuery代码在codeacademy.com以外的地方工作，所以请耐心等待。

我有三个文件，index.html，stylesheet.css和script.js（加上几张图片）都在同一个文件夹中。 index.html和style.css相互配合得很好，但是无论我放入什么内容，script.js似乎根本不想采取任何效果（使用命令就像在$上隐藏段落一样简单（文档））。就绪...

这是index.html：

<!DOCTYPE HTML>
<html>
<head>
    <title>Title</title>
    <link rel="stylesheet" type="text/css" href="stylesheet.css"/>
    <script type='text/javascript' src='script.js'></script>
</head>

<body>
<p>test test test</p>
<div class="mainh1">
    <h1 id="header1">Hi I'm <a href="mailto:redacted@gmail.com" id="email">James</a></h1>
    <h1 id="header2">I live in <a href="www.seattle.gov" id="city">Seattle</a></h1>
    <h1 id="header3">I like <a href="www.makerhaus.com" id="tinker">tinkering</a></h1>
    <h1 id="header4">and I <em>really</em> like <a href="www.analogcoffee.com" id="coffee">coffee</a></h1>
</div>

<div class="image">
    <img src="james.jpg"/>
</div>

<div class="navbar">
</div>

</body>
</html>

这是stylesheet.css：

a {
    text-decoration:none;
}

body {
    background-image: url("debut_light.png");
}
.mainh1 {
    text-align: left;
    font-family: 'Cantora One', sans-serif;
    color: #556270;
    font-size: 25px;
    text-shadow: 0 2px 0 #fff;
    margin: 0;
    margin-top: 75px;
    margin-left: 25px;
    line-height: 150%;
    display: inline-block;
}

#email {
    color: #03738E;
}

#city {
    color: #F1B703;
}

#tinker {
    color: #F15B07;
}

#coffee {
    color: #D92D01;
}

.image {
    height: 400px;
    width: 400px;
    float: right;
    overflow: hidden;
    margin-top: 75px;
    margin-right: 50px;
    border-radius: 20px;
}

.image img {
    width: 100%;
    height: 100%;
}

这是script.js：

$(document).ready( function() {
    $('p').fadeOut('slow');
});

我也尝试过连接script.js的整个源路径，我尝试将它上传到hostgator.com上的服务器但无济于事。知道为什么我的jquery不工作吗？如果这是一个简单的错误，请耐心等待，这是我编码的第5天。

Answer 1

你还没有加载jQuery。在加载脚本之前添加此代码：

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

Answer 2

好像你没有将jQuery库链接到html文件。您需要它才能运行jQuery函数，例如$(document).ready()。

有关如何下载jQuery或从CDN中包含jQuery的不同选项，请查看this page。

Answer 3

您正在使用jquery而不将其包含在您的页面中。

您必须下载jquery脚本文件，例如将其重命名为jquery.js并包含它。

<script language="JavaScript" type="text/javascript" src="/js/jquery.js"></script>

在下载jquery之间和之后添加它，它将起作用。

Answer 4

转到jquery.com并下载jQuery：）

http://jquery.com/download/

为什么我的javascript文件没有链接？

4 个答案: