我正在使用Javascript制作一个小游戏，其中有两侧。左侧有5张图片，右侧有4张图片。当用户单击左侧缺少的图片时，游戏进入下一个关卡。我还没有编写完整的代码。我已经编写了以下代码
<!--smile game-->
<!DOCTYPE html>
<html>
<head>
<title>Matching Game part3</title>
<meta charset = "UTF-8">
<style>
img
{
position: absolute;
}
div
{
position: absolute;
width: 500px;
height: 500px;
}
#rightside
{
left: 500px;
border-left: 1px solid black;
}
</style>
</head>
<body id ="theBody" onload="generateFaces();">
<h1>Matching Game</h1>
<p>Click on the extra smiling face on the left</p>
<div id="leftside"></div>
<div id="rightside"></div>
<script>
var numberOfFaces = 5;
var theLeftSide = document.getElementById("leftside");
var theRightSide = document.getElementById("rightside");
function generateFaces()
{
for(var i =0; i<numberOfFaces; i++)
{
var image = document.createElement("img");
image.src = "http://home.cse.ust.hk/~rossiter/mooc/matching_game/smile.png";
image.style.top = Math.floor(Math.random() * 400) + "px";
image.style.left = Math.floor(Math.random() * 400) + "px";
document.getElementById("leftside").appendChild(image);
}
}
leftsideimages = theLeftSide.cloneNode(true);
leftsideimages.removeChild(leftsideimages.lastChild);
theRightSide.appendChild(leftsideimages);
</script>
</body>
</html>
我收到错误
Failed to execute 'removeChild' on 'Node': parameter 1 is not of type 'Node'.
我已经浏览了 Stack Overflow 上的另外两篇文章，但无法理解如何修复我的错误。在代码中，我首先 clong 所有图像，然后删除最后一个子项，然后将所有图像添加到右侧这样就可以少 1。所以如果有人可以帮忙的话。 提前致谢。
最佳答案
您的脚本是内联在正文中的，因此它在创建正文时运行 - 并且由 generateFaces() 函数完成的任何操作肯定不会被其后面的代码访问(该方法是在正文加载期间运行脚本时创建的，但直到正文完成加载后才实际调用)
我稍微重新安排了你的代码:
<!--smile game-->
<!DOCTYPE html>
<html>
<head>
<title>Matching Game part3</title>
<meta charset = "UTF-8">
<style>
img
{
position: absolute;
}
div
{
position: absolute;
width: 500px;
height: 500px;
}
#rightside
{
left: 500px;
border-left: 1px solid black;
}
</style>
<script>
var numberOfFaces = 5;
function generateFaces()
{
for(var i =0; i<numberOfFaces; i++)
{
var image = document.createElement("img");
image.src = "http://home.cse.ust.hk/~rossiter/mooc/matching_game/smile.png";
image.style.top = Math.floor(Math.random() * 400) + "px";
image.style.left = Math.floor(Math.random() * 400) + "px";
document.getElementById("leftside").appendChild(image);
}
}
function init() {
var theLeftSide = document.getElementById("leftside");
var theRightSide = document.getElementById("rightside");
generateFaces();
leftsideimages = theLeftSide.cloneNode(true);
leftsideimages.removeChild(leftsideimages.lastChild);
theRightSide.appendChild(leftsideimages);
}
</script>
</head>
<body id ="theBody" onload="init()">
<h1>Matching Game</h1>
<p>Click on the extra smiling face on the left</p>
<div id="leftside"></div>
<div id="rightside"></div>
</body>
</html>
关于javascript - 无法在 'removeChild' : parameter 1 is not of type 'Node' 上执行 'Node'，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/37495059/