儿童Javascript游戏答案

【问题标题】：Javascript Game for Kids儿童Javascript游戏
【发布时间】：2012-12-25 22:26:20
【问题描述】：

我正在尝试用 javascript 制作游戏。我在代码中仍然有很多问题。代码应该有 2 个按钮；一个用于洗牌图像骰子和一个用于检查孩子是否写正确答案的按钮。

2 个按钮
1 个文本框
以及显示答案是否正确的地方

这是我的代码。

我不知道为什么当我输入 document.getElementbyID("test") 的源时它什么也没显示因为我希望每次点击开始时都会选择一个随机图像。

感谢任何帮助，因为我还是 javascript 的初学者。

  <head> 

<script type="text/javascript">


function startf(){
var images = []; 
index = 0;
images[0] = "<img src='1.png' length=70px width=75px>";
images[1] = "<img src='2.png' length=70px width=75px>";
images[2] = "<img src='3.png' length=70px width=75px>";
images[3] = "<img src='4.png' length=70px width=75px>";
index = Math.floor(Math.random() * images.length);
take(index);

function take(ind)
{
return document.getElementbyId("ind")="What should i put here";
}
}
function check(){
var ch=getElementbyId("answer").value;
if (ch=index+1)
{
document.getElementbyId.innerHTML="TRUE";
}
else
{
document.getElementbyId.innerHTML="False";
}

}
</script><br>
</head>
<img id="test" src=""  alt="..." length="75px" width="75px" />

<body>

<input type="button" value="start" onclick="startf()">
<input id="answer" type="text" name="checkvalue" value="Enter Value" onclick="check()">
<div id="fa">
</div>
<input type="button" value=chek onclick="check()">


</body>

【问题讨论】：

标点符号！...
欢迎来到 SO。请确保您的 html 是有效的。有许多 html 错误。还可以考虑使用jsfiddle.net 创建一个可以轻松分析的示例。您将获得更多帮助。
getElementbyID ID 应该是 Id。你也有一个使用by，应该是By。考虑使用更好的 IDE。
控制台说：TypeError: Object #<HTMLDocument> has no method 'getElementbyID'。 Stackoverflow 不是调试服务，您可以自己做一点。
再看一眼，是的，有很多关于 JavaScript 基础的问题。我建议先阅读 MDN JavaScript 指南：developer.mozilla.org/en-US/docs/JavaScript/Guide。例如用==或===进行比较，=是赋值运算符。

标签： javascript html getelementbyid

【解决方案1】：

1- 放置和结束每个指令 --> ;

2- 不要直接使用 document.getElementById，至少会出现一次错误，你不希望这样。

function _e(id) {
   return document.getElementById(id);
}

3- 始终将括号和 (...) 放在 IF-ELSE 块周围：

if (...) {
    //....
} else {
    //....
}

4- 每个标签属性的值都应该有“”，例如：

<input type="button" value="start" onclick="check()" />

5- 您只能将图像路径放入数组中，因为它似乎是需要在#test 图像中更新的内容。

【讨论】：

我知道 :-) 但我认为在进入更大的项目之前需要关心的重要事项。
虽然这是一种很好的做法，但在属性值周围加上引号并不总是必要。在这种情况下，省略它们是完全有效的（假设它是 HTML 而不是 XHTML）。
@FelixKling 感谢您指出，我编辑为“应该有”
非常感谢我查看了所有回复我修复了每个人所说的但我不明白使用函数调用 getElementbyId 的意义因为我仍然无法让它正确我只是想要它在页面顶部显示更新和更正后检查我的代码的内容，但请告诉我我应该在 getElementbyId 中更正什么，因为我仍然是初学者，谢谢
@user1928775：嗯，你写的一些代码没有意义，为你纠正每一点代码并不是 SO 的目的。例如，你打算用这条线做什么：return document.getElementbyId("ind")="What should i put here";？除了拼写错误，getElementById 返回一个 DOM 元素，你不能给它分配一个字符串。我了解到您刚开始接触 JS，但在这种情况下，您应该先阅读更多教程。

【解决方案2】：

是document.getElementById 检查大小写。您的检查功能错误...您无法为 document.getElementById 功能分配值。你的 if 也是错误的。你知道任何 JavaScript 吗？

【讨论】：

【解决方案3】：

我猜你想要的可能是这样的。您似乎试图通过使用 document.getElementById(id) = something 添加或替换元素，但这不是它的工作方式。相反，要将图像更改为另一个文件，您需要更改其src 属性。（还有其他方法，但这可能是最简单的。）

// Declare the variable called number here so it can be accessed
// by all of the following functions.
var number;

// a simple function to save typing document.getElementById all the time
function _e(id) {
    return document.getElementById(id);
}
function startf() {
    // Pick a number between 1 and 4
    number = Math.floor(Math.random() * 4 + 1);

    // Set the image with id 'test' to have the source 1.png, 2.png etc.
    _e('test').src = number + '.png';
}

function check() {
    // note that == is used for comparison, = is used for assignment
    if (_e('answer').value == number) {
        _e('fa').innerHTML = "TRUE";
    }
    else {
        _e('fa').innerHTML = "False";
    }
}

【讨论】：