新手开发Blackjack网页时引入game.js出现ERR_FILE_NOT_FOUND错误的求助

我是JavaScript新手，在将JavaScript文件链接到网页时遇到了文件未找到的错误，查阅学习笔记后仍无法解决，特此寻求帮助。

我的HTML文件代码： #

<html> 
<head> 
<script src="game.js"></script> 
<style> 
table{ margin:auto; width:100%; } 
tr.spacer{ height:55px; } 
div#header{ width: 100%; text-align: right; } 
div#wrapper{ /*border: solid red 1px;*/ width: 750px; margin:auto; text-align:center; } 
div.dealer,div.player{ float:left; background-image:url("cards.png"); width:74px; height:99px; /* move 1 card right is -73px */ /* move 1 card down is -98px */ background-position:0px 0px ; margin-left:15px; margin-right:15px; } 
img{ width:214px; height:196px; } 
input[type='button']{ width: 201px; height:75px; background-color : #4CAF50; text-align:center; margin: 25px; } 
input#reload{ margin: 7px 35px; } 
</style> 
</head> 
<body onload="deal();"> 
<div id="header"> 
<input id="reload" type = "button" value="Start a new Game" onclick="location.reload();"> 
</div> 
<div id="wrapper"> 
<table border=0 id="blackjacktable"> 
<tr class="spacer"></tr> 
<tr> 
<th id="dealerLabel" colspan=2 >Dealer </th> 
</tr> 
<tr> 
<th colspan=2 id="dealerScore"></th> 
</tr> 
<tr> 
<td id="dealerHand"> 
<img id="dealer1" src="" width="107" height="98"> 
<img id="dealer2" src="" width="107" height="98"> 
</td> 
</tr> 
<tr class="spacer"></tr> 
<tr> 
<th id="playerLabel" colspan=2>Player </th> 
</tr> 
<tr> 
<th colspan=2 id="playerScore"></th> 
</tr> 
<tr> 
<td> 
<input id="btnDraw" type="button" onclick="requestPlayerCard();" value="Draw 1 more Card"> 
<input id="btnHold" type="button" onclick="completeDealerHand();" value="Hold"> 
</td> 
</tr> 
<tr> 
<td id="playerHand"> 
<img id="player1" src="" width="107" height="98"> 
<img id="player2" src="" width="107" height="98"> 
</td> 
</tr> 
</table> 
</div> 
</body> 
</html>

我的JavaScript文件（game.js）代码： #

var cardsArr = new Array( 'img/1.png','img/2.png','img/3.png','img/4.png','img/5.png','img/6.png','img/7.png','img/8.png', 'img/9.png','img/10.png','img/11.png','img/12.png','img/13.png','img/14.png','img/15.png','img/16.png', 'img/17.png','img/18.png','img/19.png','img/20.png','img/21.png','img/22.png','img/23.png','img/24.png', 'img/25.png','img/26.png','img/27.png','img/28.png','img/29.png','img/30.png','img/31.png','img/32.png', 'img/33.png','img/34.png','img/35.png','img/36.png','img/37.png','img/38.png','img/39.png','img/40.png', 'img/41.png','img/42.png','img/43.png','img/44.png','img/45.png','img/46.png','img/47.png','img/48.png', 'img/49.png','img/50.png','img/51.png','img/52.png'); 
function deal() { 
    getRandCard(); 
} 
function requestPlayerCard() { } 
function completeDealerHand() { } 
function getRandCard() { 
    var randomCard = Math.floor(Math.random() * cardsArr.length) + 1; 
    document.getElementById("dealer1").src = [randomCard]; 
    document.getElementById("dealer2").src = 'img/back.png'; 
}

收到的错误信息： #

1:1 GET file:///C:/Users/Theod/Desktop/school/Internet%20programming/Assigments/Assignment%204/blackjack-students/blackjack/1 net::ERR_FILE_NOT_FOUND

我的开发环境与文件夹结构： #

我当前使用Notepad++进行开发，文件夹结构为：
C:\Users\Theod\Desktop\school\Internet programming\Assigments\Assignment 4\blackjack-students\blackjack\img
我已多次检查并确认文件路径设置正确，但还是出现错误，恳请各位提供解决该问题的建议。

解决建议 #

兄弟，我看了你的代码，发现问题根本不是文件路径没设置对，而是你的JavaScript代码逻辑出问题啦！

你看getRandCard函数里的这两行：

var randomCard = Math.floor(Math.random() * cardsArr.length) + 1;
document.getElementById("dealer1").src = [randomCard];

这里有两个明显的错误：

1. 数组索引越界风险：cardsArr是一个包含52个元素的数组，数组的索引是从0开始的（也就是0到51）。你现在用Math.floor(...) +1会得到1到52的数字，当数字是52的时候，去访问cardsArr[52]就会拿到undefined，这肯定不对，得把+1去掉。
2. 错误的图片路径赋值：你直接把[randomCard]赋值给了图片的src属性，这相当于告诉浏览器去当前目录找一个叫1、2这类名字的文件，但你的图片明明都在img文件夹里，路径应该是img/1.png这种啊！正确的做法是用随机生成的索引去取cardsArr里对应的路径。

修改后的getRandCard函数应该是这样的：

function getRandCard() {
    // 生成0到51之间的随机索引，对应cardsArr里的元素
    var randomIndex = Math.floor(Math.random() * cardsArr.length);
    // 从数组里取出正确的图片路径赋值给src
    document.getElementById("dealer1").src = cardsArr[randomIndex];
    document.getElementById("dealer2").src = 'img/back.png';
}

另外，你顺便检查一下img/back.png这个文件是不是真的存在于你的img文件夹里，避免后续又出现找不到文件的问题哦！

内容的提问来源于stack exchange，提问作者user14602899