如何正确替换输出?



我最近做了一个骰子游戏。我寻求有关如何构建功能按钮的帮助,并且能够制作它。现在我正在尝试使每个结果替换以前的输出,这样我就可以一遍又一遍地掷骰子,但一次只能在页面上掷骰子(所以不是掷骰子列表(。

请告诉我我的以下代码做错了什么,因为我已经查找了 .replace 并且在我看来它应该可以工作。

.HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>My own personal Dice Roll</title>
<script src="dice.js"></script>
</head>
<body>
<button onclick="diceRoll();" id="roll">Throw Dice</button>
<h2>Dice Game:</h2>
<div id= "output"></div>
</body> 
</html>

.JS

function diceRoll() {
const value = [ 1, 2, 3, 4, 5, 6 ];
let random = Math.floor(Math.random() * value.length + 1);
let roll = `You rolled: ${random}`;
output(roll);
}
function output(message) {
document.getElementById('output').innerHTML += roll.replace(message + '<br/><br/>');
}

更改

document.getElementById('output').innerHTML += roll.replace(message + '<br/><br/>');

document.getElementById('output').innerHTML = message;

不能从output函数中引用roll。它在那里不存在。它存在于diceRoll函数中,并且您将其值作为message传递给output函数,因此您将该值称为output函数中的message

x += yx = x + y的简写,这意味着您要向x添加y。如果要覆盖该值,只需使用=

替换方法不同。若要使用 replace 方法,需要三样东西。你需要一个你感兴趣的字符串。然后,您需要要在第一个字符串中搜索的另一个字符串。然后,如果在第一个字符串中找到第二个字符串,则需要第三个字符串来替换它。它的工作原理是这样的:

var interestingString = "i hate js";
var searchString = "hate";
var replaceString = "love";
console.log( interestingString.replace(searchString, replaceString) );

您可以使用此方法来完成您要做的事情,但这太过分了。会是这样的:

document.getElementById('output').innerHTML = document.getElementById('output').innerHTML.replace(document.getElementById('output').innerHTML, message);

最新更新