我最近开始了网络开发。由于我一直在尝试使用 jQuery 制作页面，因此遇到了很多麻烦。我从 HTML 页面编写和链接的代码不会加载，当我在浏览器中查看控制台时，它不会显示任何正在加载的脚本。我可以让它们加载的唯一方法是将我的代码包装<script>在 HTML 文档本身的标签中，然后它就可以正常工作了。我试过<script src="source.js">在<head>标签中使用，以及在关闭之前<body>标签，但没有任何反应。.css 文件加载，除了 Javascript，网站运行良好。如果您发现我做错了什么，例如格式化代码本身或使用不良样式，请同时指出。当我试图成为一名开发人员时，您可以提供的任何帮助将不胜感激。以下是我遇到问题的众多网站之一的文件：
<!DOCTYPE html>
<html>
<head>
<meta content="text/html; charset=windows-1252" http-equiv="content-type">
<link rel="stylesheet" href="dot_grid.css">
<script src="dot_grid.js"></script>
<title></title>
</head>
<body>
<div id="container">
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<br>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<br>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<br>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<br>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<br>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<br>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<br>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<br>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<br>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
<div></div>
</div>
<div id="reset">RESET</div>
<div id="opac">Change opacity</div>
</body>
</html>
所有这些<div>标签都在制作网格......如果有更好的方法，请告诉我：P
CSS：
div div{
height:25px;
width:25px;
display:inline-block;
border-radius:100%;
background:orange;
position:static;
border:none;
}
.other1 {
background:teal;
}
#addRow {
height:25px;
width:35px;
background:#334477;
border-radius:5px;
text-align:center;
}
#reset {
height:1em;
width:3.25em;
font-size:1em;
padding:5px;
text-align:center;
border-radius:5px;
opacity:0.3;
background:blue;
color:white;
border:1px solid black;
}
#reset:hover {
color:black;
background:#666600;
text-decoration:underline;
}
#opac {
height:1em;
width:6.5em;
font-size:1em;
padding:5px;
text-align:center;
border-radius:5px;
background:blue;
color:white;
opacity:0.3;
border:1px solid black;
}
#opac:hover {
color:black;
background:#666600;
text-decoration:underline;
}
...和 jQuery 文件：
$(document).ready(function() {
$("div div").mouseenter(function(){
$(this).css("background","red");
});
$("div div").mouseleave(function(){
$(this).css("background","orange");
});
$(".other1").mouseenter(function(){
$(this).css("background","blue");
});
$(".other1").mouseleave(function(){
$(this).css("background","teal");
});
$("div div").click(function(){
$(this).fadeTo("slow",0);
});
$("#reset").click(function(){
$("div div").fadeTo("slow",1);
});
$("#reset").mouseenter(function(){
$(this).fadeTo("fast",1);
});
$("#reset").mouseleave(function(){
$(this).fadeTo("fast",0.3);
});
$("#opac").click(function(){
$("div div").fadeTo("slow",Math.random());
});
$("#opac").mouseenter(function(){
$(this).fadeTo("fast",1);
});
$("#opac").mouseleave(function(){
$(this).fadeTo("fast",0.3);
});
});
很抱歉文件太长了，但如果你能帮助我，那就太好了。