Question

我有一些功能和一些变量。我想在我的浏览器上将变量和函数结果作为文本返回。

我所做的是制作了一个带有文字的HTML文件：

<SCRIPT SRC="rockpaper.js">
</SCRIPT>

这是指这个javascript文件：

var userChoice = prompt("Do you choose rock, paper or scissors?");
var computerChoice = Math.random();
if (computerChoice < 0.34) {
    computerChoice = "Computer chooses rock";
} else if(computerChoice <= 0.67) {
    computerChoice = "Computer chooses paper";
} else {
    computerChoice = "Computer chooses scissors";
}

console.log(computerChoice);

var compare = function(choice1,choice2)
{
    if(choice1===choice2)
    {
        return("The result is a tie!");
    }

    if(choice1==="Computer chooses rock")
    {
        if(choice2==="scissors")
        {
            return("rock wins");
        }
            else
            {
                return("paper wins");
            }
    }
    if(choice1==="Computer chooses paper")
    {
        if(choice2==="rock")
            return("paper wins");
            else
            {
                return("scissors wins");
            }
    }
    if(choice1==="Computer chooses scissors")
    {
        if(choice2==="rock")
        {
        return("rock wins");
        }
        else
        {
            return("scissors wins");
        }
    }
}

console.log(compare(computerChoice,userChoice))

但是，当我用浏览器打开它时，文本不会显示，但提示符会显示。

但它在Codecademy中运行良好。

Answer 1

这是一个jsFiddle，用于将数据记录到屏幕上。我注意到你的领带逻辑是有缺陷的。你正在为用户简单的单字串字符串写一个大字符串。你需要标记化;从计算机选择字符串中提取状态。

<强>的Javascript

// Helpful utility function...
function logResultToScreen(result) {
    var block = document.createElement('div');
    var text = document.createTextNode(result);
    var output = document.getElementById('output');

    block.appendChild(text);
    output.insertBefore(block);
}


var userChoice = prompt("Do you choose rock, paper or scissors?");
var computerChoice = Math.random();

if (computerChoice < 0.34) {
    computerChoice = "Computer chooses rock";
} else if (computerChoice <= 0.67) {
    computerChoice = "Computer chooses paper";
} else {
    computerChoice = "Computer chooses scissors";
}

console.log(computerChoice);
logResultToScreen(computerChoice);

var compare = function (choice1, choice2) {
    var tokens = choice1.split(' ');

    if (tokens[2] === choice2) {
        return ("The result is a tie!");
    }

    if (choice1 === "Computer chooses rock") {
        if (choice2 === "scissors") {
            return ("rock wins");
        } else {
            return ("paper wins");
        }
    }
    if (choice1 === "Computer chooses paper") {
        if (choice2 === "rock") {
            return ("paper wins");
        } else {
            return ("scissors wins");
        }
    }
    if (choice1 === "Computer chooses scissors") {
        if (choice2 === "paper") {
            return ("scissors wins");
        } else {
            return ("rock wins");
        }
    }
}

var output = compare(computerChoice, userChoice);
logResultToScreen(output);
console.log(output);

<强> HTML

<div id="output"><strong>Results:</strong></div>

Answer 2

您使用console.log（），因此您应该在开发者控制台中看到输出（按F12并打开控制台选项卡）。

要将其放在页面上，您必须创建一个DOM（html）元素并将其添加到页面中。

<SCRIPT SRC="rockpaper.js">
</SCRIPT>
<div id="container"></div>

在你的脚本中替换

 console.log(compare(computerChoice,userChoice))

与

 var container = document.getElementById("container");
 container.innerHTML = compare(computerChoice,userChoice);

快乐的编码！

将返回显示为文本

2 个答案: