当结果匹配时，它不会显示第一条消息，它只会在丢失时显示消息。
我对它进行了调整，结果它要么总是说你赢了，即使它告诉你猜到的与不匹配
JS代码
function play(){
let random = Math.floor(Math.random() * 3 + 1)
let guess = document.querySelector('#myguess').value;
let pick = document.querySelector('#pick');
if (guess.value === random){
pick.innerText = 'You picked '+guess+" the result was "+random+" Congrats!, you guessed correctly"
}
else {
pick.innerText = 'You picked '+guess+" the result was "+random+" Looks like you guessed incorrectly! Sorry :("
}
}
document.getElementById('btn').addEventListener("click", play)
html
<!DOCTYPE html>
<html lang="en" dir="ltr">
<head>
<meta charset="utf-8">
<title>Guess the number</title>
<!-- stylesheet -->
<link rel="stylesheet" href="/Users/leon/Desktop/Webdevelopment/guessinggame/guessstyles.css">
<!-- global fonts -->
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Roboto+Mono&display=swap" rel="stylesheet">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/fork-awesome/1.2.0/css/fork-awesome.min.css" integrity="sha512-aupidr80M36SeyviA/hZ2uEPnvt2dTJfyjm9y6z1MgaV13TgzmDiFdsH3cvSNG27mRIj7gJ2gNeg1HeySJyE3Q==" crossorigin="anonymous" referrerpolicy="no-referrer" />
<!-- font awesome -->
</head>
<body>
<div class="container">
<div class="header">
<h2>Pick A Number between 1 and 3</h2>
</div>
<div class="number-area">
<input type="number" id="myguess">
<button id="btn" onclick="play()">Submit</button>
</div>
<div class="result">
<p id="pick">Let's see if you picked the correct number?</p>
</div>
</div>
</body>
<script src="/Users/leon/Desktop/Webdevelopment/guessinggame/guessindex.js"></script>
</html>
在这个比较中：
if (guess.value === random){
guess是一个字符串guess.value就是undefinedrandom是一个数字===检查类型相等和值相等
首先，删除.value，因为它不是字符串上的属性。除此之外，您还可以进行较弱的非类型检查比较：
if (guess == random){
或者您可以转换类型，例如将字符串解析为数字：
if (parseInt(guess) === random){