[英]Sending a string/result from JS to HTML-page
I'm working on a simple rock, paper, scissors game of HTML + JS. 我正在研究一个简单的HTML + JS剪刀石头布的游戏。
Here are the full codes (CSS, JS, HTML): http://jsfiddle.net/fJw4R/ (too long to past here I thought). 以下是完整的代码(CSS,JS,HTML): http : //jsfiddle.net/fJw4R/ (我认为在这里过长了)。 Here you can see it with pictures: http://shinebrightmedia.se/rps/rockpaperscissors.html
在这里,您可以看到带有图片的图片: http : //shinebrightmedia.se/rps/rockpaperscissors.html
As you can see, the .math-module works, and when you choose rock, paper or scissor the computer randomizes a choice. 如您所见,.math模块起作用,并且当您选择岩石,纸张或剪刀时,计算机会随机选择一个选项。
However, I now would like to have a textstring underneath the computer/monitor, and I'm wondering what the easiest way to do that. 但是,我现在想在计算机/显示器下面放一个文本字符串,我想知道最简单的方法是什么。 I want it to either say YOU WIN!
我要它要么说您赢了! or YOU LOSE!
还是你输了!
I started on a function looking like this: 我从一个看起来像这样的函数开始:
function theWinnerIs(userChoice, computerChoice) {
if (userChoice === computerChoice ) {
return 'No winner, it is a draw';
}
if ((userChoice === 'rock') && (computerChoice === 'scissor')) {
return 'human';
}
if ((userChoice === 'rock') && (computerChoice === 'paper')) {
return 'computer';
}
if ((userChoice === 'paper') && (computerChoice === 'scissor')) {
return 'computer';
}
if ((userChoice === 'paper') && (computerChoice === 'rock')) {
return 'human';
}
if ((userChoice === 'scissor') && (computerChoice === 'rock')) {
return 'computer';
}
if ((userChoice === 'scissor') && (computerChoice === 'paper')) {
return 'human';
}
}
What is the easiest way to send the return to the index-file? 将返回值发送到索引文件的最简单方法是什么? ie.
即。 YOU WIN!
你赢了! or YOU LOSE!
还是你输了!
Thanks for any help. 谢谢你的帮助。
No need to use this block of if
s - here's very compact alternative: 无需使用
if
块-这是一个非常紧凑的选择:
var choices = { rock: -1, paper: 0, scissors: 1 };
var score = choices[userChoice] - choices[computerChoice];
score = score - (score/2|0) * 3;
... which will give you -1
if user loses the round, 1
if they win, 0
in case of draw. ...它会给你
-1
,如果用户丢失了一轮, 1
如果他们赢了, 0
的平局的情况下。
Now you can just send the output to any prepared container by filling its innerHTML property: 现在,您可以通过填充其innerHTML属性将输出发送到任何准备好的容器:
var results = {
'-1': 'YOU LOSE',
'1': 'YOU WIN',
'0': 'IT\'S A DRAW'
};
var resultContainer = document.getElementById('result');
resultContainer.innerHTML = results[score];
Here's a small demo to illustrate both those concepts. 这是一个小示例,用来说明这两个概念。
From what I understand, you would like to display some text depending on the outcome of your "theWinnerIs" method. 据我了解,您希望根据“ theWinnerIs”方法的结果显示一些文本。 I would suggest you create a div on your page and set its content with JavaScript.
我建议您在页面上创建一个div并使用JavaScript设置其内容。 There are numerous ways to accomplish your goal, however.
但是,有许多方法可以实现您的目标。
So you want to add a div to your page, something like <div id="output"></div>
. 因此,您想将div添加到页面中,例如
<div id="output"></div>
。 You can then update the text here with the following 然后,您可以使用以下内容在此处更新文本
var outputElement = document.getElementById("output");
outputElement.innerHTML = theWinnerIs(userChoice, computerChoice);
Here's an updated version of your code for perspective, though raina77ow's solution is much nicer. 这是透视图代码的更新版本 ,尽管raina77ow的解决方案更好。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.