我是第一次使用 Javascript 和 jQuery，我不知道我做错了什么。我有一个家庭作业，它为我提供了添加该行的 .html 文档。
这是我的 .html
<!DOCTYPE html>
<html>
<head>
<title>Jiggle Into JavaScript</title>
<!-- <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.min.js"></script> -->
</head>
<body>
<p>Press the buttons to change the box!</p>
<div id="box" style="height:150px; width:150px; background-color:orange; margin:25px"></div>
<button id="button1">Grow</button>
<button id="button2">Blue</button>
<button id="button3">Fade</button>
<button id="button4">Reset</button>
<script type="text/javascript" src="javascript.js"></script>
<script type="text/javascript" src="https://code.jquery.com/jquery-3.1.0.mins.js"></script>
</body>
这是我的 .js 文件
function index(){
var $box = $('#box');
$("#button1").click(function(){
$("#box").animate({height: 300px});
});
$("#button2").click(function(){
$("#box").css("color", "blue");
});
$("#button3").click(function(){
$("#box").fadeOut();
});
$("#button4").click(function(){
$("box").end();
});
};
$(document).ready(index);
最佳答案
function index(){
var $box = $('#box');
$("#button1").click(function(){
$("#box").animate({height: '300px'});
});
$("#button2").click(function(){
$("#box").css("background-color", "blue");
});
$("#button3").click(function(){
$("#box").fadeOut();
});
$("#button4").click(function(){
$("box").end();
});
};
$(document).ready(index);<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<body>
<p>Press the buttons to change the box!</p>
<div id="box" style="height:150px; width:150px; background-color:orange; margin:25px"></div>
<button id="button1">Grow</button>
<button id="button2">Blue</button>
<button id="button3">Fade</button>
<button id="button4">Reset</button>
</body>您为高度提供字符串值，您需要用引号将300px括起来，此外，如果您尝试更改背景颜色而不是使用backgroundColor或background-color属性，则使用颜色更改文本的颜色。
这些是您犯过的一些常见错误，还要考虑一下“pointy”给您的建议。
关于javascript - 第一次使用 Javascript 和 jQuery，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/45982509/